24 COLOR SETS / 46 ORIGINAL PALETTES

하나의 색 조합으로,
사이트 전체를 바꿔보세요.

목록·대문·위젯에 같은 색조를 적용합니다.
선택은 이 브라우저에 저장됩니다.

컬러셋 고르기 ↓

기본 컬러

적용된 모션 목록 보기 →

업종별 컬러셋 24

24개 컬러셋

유치원 / 부드러운

라벤더 놀이색

연령별 프로그램·활동 사진

분홍과 하늘색은 장식과 구분 면에, 보라는 행동 버튼에 씁니다.

밝은 모드 · 본문 13.7:1 / 버튼 7.73:1

원본 색 조합 ↗
유치원 / 산뜻한

노랑 민트 놀이색

신학기 안내·놀이 과정

밝은 노랑 면에 짙은 초록 글자를 올려 활기와 가독성을 함께 만듭니다.

밝은 모드 · 본문 11.26:1 / 버튼 6.9:1

원본 색 조합 ↗
유치원 / 선명한

하늘 노랑 놀이색

야외 활동·과학 놀이·행사 안내

노랑은 활동 구분에, 짙은 청록은 신청 버튼에 사용합니다.

밝은 모드 · 본문 13.17:1 / 버튼 6.38:1

원본 색 조합 ↗
유치원 / 선명한

보라 노랑 창작색

미술·음악·창의 프로그램

원색은 한 카드에 한 가지씩 배치하고 긴 본문은 흰 면에 둡니다.

밝은 모드 · 본문 13.27:1 / 버튼 6.84:1

원본 색 조합 ↗
어린이집 / 따뜻한

살구 돌봄색

돌봄 안내·하루 일과

살구 면은 짧은 안내에 쓰고 긴 공지는 흰 카드에 둡니다.

밝은 모드 · 본문 9.5:1 / 버튼 6.79:1

원본 색 조합 ↗
어린이집 / 자연스러운

숲 돌봄색

숲 놀이·시설 사진

초록은 사진의 자연색과 연결하고 정보 카드에는 충분한 여백을 둡니다.

밝은 모드 · 본문 11.76:1 / 버튼 7.73:1

원본 색 조합 ↗
어린이집 / 자연스러운

연두 살구 돌봄색

생태 놀이·식단·돌봄 프로그램

연두 면에 일과를 묶고 살구 계열 버튼으로 상담을 연결합니다.

밝은 모드 · 본문 10.39:1 / 버튼 7.04:1

원본 색 조합 ↗
어린이집 / 부드러운

연보라 안심색

영아반·시설 안내·보호자 공지

연보라 넓은 면과 흰 카드를 번갈아 써 내용을 구분합니다.

밝은 모드 · 본문 11.71:1 / 버튼 6.95:1

원본 색 조합 ↗
학원 / 산뜻한

맑은 학습색

과목 소개·시간표

맑은 파랑은 분류와 상담 버튼에, 하늘색은 과정 구분에 씁니다.

밝은 모드 · 본문 16.94:1 / 버튼 4.87:1

원본 색 조합 ↗
학원 / 선명한

남색 노랑 학습색

학습 목표·집중 과정

노랑을 본문 글자색으로 쓰지 않고 일정과 단계 표시 면에 씁니다.

밝은 모드 · 본문 13.56:1 / 버튼 10.16:1

원본 색 조합 ↗
학원 / 자연스러운

초록 탐구색

탐구·과학·성장 과정

연두는 과정 단계에, 짙은 초록은 시간표와 상담 버튼에 씁니다.

밝은 모드 · 본문 12.14:1 / 버튼 6.98:1

원본 색 조합 ↗
학원 / 선명한

보라 디지털 학습색

코딩·디자인·창작 수업

강한 보라는 핵심 행동에 쓰고 과정 설명은 밝은 면에 둡니다.

밝은 모드 · 본문 15.5:1 / 버튼 10.26:1

원본 색 조합 ↗
기업 / 차분한

회청 기업색

서비스 소개·프로젝트

회청색 배경에는 진한 본문을 사용하고 표의 단위를 함께 표시합니다.

밝은 모드 · 본문 17.45:1 / 버튼 7.01:1

원본 색 조합 ↗
기업 / 차분한

먹색 금빛 기업색

전문 서비스·브랜드 소개

금빛은 작은 강조에 쓰고 제목과 행동 버튼은 먹색으로 통일합니다.

밝은 모드 · 본문 15.97:1 / 버튼 15.97:1

원본 색 조합 ↗
기업 / 자연스러운

초록 지속가능색

환경·건축·소재 기업

자연색 사진과 함께 쓰고 핵심 지표는 짙은 초록으로 강조합니다.

밝은 모드 · 본문 14.11:1 / 버튼 6.79:1

원본 색 조합 ↗
기업 / 차분한

회색 기술색

기술·제조·전문 서비스

자료와 도면이 많은 페이지에서 무채색을 바탕으로 사용합니다.

밝은 모드 · 본문 14.63:1 / 버튼 8.18:1

원본 색 조합 ↗
카페 / 자연스러운

올리브 크림색

공간 소개·브런치

크림 바탕에 음식 사진을 두고 올리브 버튼으로 메뉴 분류를 연결합니다.

밝은 모드 · 본문 12.24:1 / 버튼 5.68:1

원본 색 조합 ↗
카페 / 따뜻한

커피 종이색

원두·커피 메뉴

갈색은 메뉴 선택에 쓰고 가격과 설명은 어두운 먹색으로 읽힙니다.

밝은 모드 · 본문 11.76:1 / 버튼 7.79:1

원본 색 조합 ↗
카페 / 따뜻한

갈색 호박색

베이커리·원두·구움과자

제품 사진의 노랑과 갈색을 살리고 가격은 진한 본문색으로 둡니다.

밝은 모드 · 본문 12.77:1 / 버튼 7.17:1

원본 색 조합 ↗
카페 / 산뜻한

청록 살구색

디저트·브런치·계절 메뉴

살구는 메뉴 묶음에, 청록은 분류와 선택 표시에 사용합니다.

밝은 모드 · 본문 11.28:1 / 버튼 6.51:1

원본 색 조합 ↗
쇼핑몰 / 산뜻한

바다 포인트색

시즌 컬렉션·생활용품

붉은 포인트는 주요 행동에 집중하고 상품 배경은 밝게 유지합니다.

밝은 모드 · 본문 11.56:1 / 버튼 7.22:1

원본 색 조합 ↗
쇼핑몰 / 차분한

차분한 상품색

리빙·공예·의류

중성 바탕으로 제품 색을 살리고 선택 상태는 선과 글자도 함께 바꿉니다.

밝은 모드 · 본문 9.3:1 / 버튼 6.76:1

원본 색 조합 ↗
쇼핑몰 / 선명한

장미 상품색

뷰티·패션·선물 컬렉션

장미색은 작은 라벨과 배너에 쓰고 상품 사진 주위에는 흰 여백을 둡니다.

밝은 모드 · 본문 12.57:1 / 버튼 9.89:1

원본 색 조합 ↗
쇼핑몰 / 따뜻한

남색 벽돌 상품색

생활용품·공예·편집숍

남색으로 내용을 묶고 벽돌색은 구매로 이어지는 행동에 집중합니다.

밝은 모드 · 본문 12.25:1 / 버튼 8.06:1

원본 색 조합 ↗

SAME COLOR / REAL WIDGET

실제 화면에서도 확인하세요.

크게 열기 ↗

사진과 그림의 고유 색은 유지하고 바탕·본문·버튼·테두리에 선택한 색조를 적용합니다.

COLOR ROLES

색마다 맡길 역할을 정하세요.

밝은 원본 색은 넓은 면에, 진한 색은 본문과 버튼에 사용합니다. 본문 대비 4.5:1 이상을 기준으로 조정한 팔레트이며, 사진 위의 글자와 투명한 면은 따로 확인해야 합니다.

색 대비 기준 ↗

색을 정할 때 함께 볼 자료

원본 팔레트 46개 보기

Ocean Blue Serenity

Coolors 원본 ↗

Meadow Green

Coolors 원본 ↗

Ocean Sunset

Coolors 원본 ↗

Light Steel

Coolors 원본 ↗

Soft Peachy Delight

Coolors 원본 ↗

Warm Neutral Tones

Coolors 원본 ↗

Cherry Blossom Bloom

Coolors 원본 ↗

Fiery Red Sunset

Coolors 원본 ↗

Purple Raindrops

Coolors 원본 ↗

Vibrant Sunset

Coolors 원본 ↗

Spring Green Harmony

Coolors 원본 ↗