쿨 그레이 컬러 팔레트 아이디어 (20가지 선택 + Hex)

쿨 그레이는 깔끔함과 아늑함 사이의 완벽한 지점에 자리합니다: UI에 충분히 현대적이고, 인쇄물에 충분히 중립적이며, 인테리어에 충분히 차분합니다. 순수한 흑백의 거칠함 없이 명료함을 원할 때 선택하는 색상입니다.

아래는 HEX 코드와 함께 엄선된 20가지 쿨 그레이 컬러 팔레트 아이디어와 액센트 색상 페어링 및 실제 디자인 작업에서 이러한 톤을 사용하는 빠른 팁입니다.

쿨 그레이 컬러 스킴이 효과적인 이유

쿨 그레이 컬러 스킴은 주목을 요구하지 않으면서 구조를 제공하기 때문에 신뢰할 수 있습니다. 전체적인 톤을 절제된 상태로 유지하면서 타이포그래피, UI 구성 요소 및 레이아웃에 깔끔한 계층 구조를 만듭니다.

베이지색으로 흐를 수 있는 웜 그레이와 달리 쿨 그레이는 깔끔하고 현대적인 느낌을 유지합니다. 이는 기술 브랜딩, 데이터 중심 대시보드 및 미니멀리스트 에디토리얼 디자인에 특히 강력합니다.

또한 유연합니다: 프리미엄 느낌을 위해 순수하게 중립적으로 유지하거나, 전체 시스템을 재디자인하지 않고도 분위기를 조정하기 위해 단일 액센트(틸, 블루, 코퍼, 블러시)를 도입할 수 있습니다.

20가지 이상의 쿨 그레이 컬러 팔레트 아이디어 (HEX 코드 포함)

1) 북극 콘크리트

HEX: #f2f4f7 #d7dde4 #aab3bf #6b7480 #2f343b

분위기: 깔끔한, 차분한, 전문적인

최적 용도: SaaS 대시보드 UI

콘크리트 위의 아침 햇살처럼 깔끔하고 통풍이 잘 되는 이 쿨 그레이 톤은 조용하고 자신감 있게 느껴집니다. 이 조합은 화면에서 선명하게 읽히며 차트, 내비게이션 및 상태에 충분한 깊이를 제공합니다. 세련된 룩을 위해 단일 쿨 액센트(틸 또는 아이시 블루)와 페어링하고 타이포그래피는 순수한 블랙 대신 차콜을 유지하세요. 사용 팁: #2f343b는 제목과 주요 숫자에만 사용하여 인터페이스를 밝게 유지하세요. 데이터 중심 레이아웃을 위한 쿨 그레이 컬러 스킴으로도 잘 적응됩니다.

media.io를 사용하여 생성된 북극 콘크리트 이미지 예시

Media.io

Media.io는 브라우저에서 비디오, 이미지 및 오디오를 생성하고 편집하는 온라인 AI 스튜디오입니다.

지금 무료로 사용해보기

2) 스틸 미스트

HEX: #eef1f4 #cbd2da #9aa3ad #59616b #1f2328

분위기: 세련된, 산업적인, 현대적인

최적 용도: 기술 브랜드 아이덴티티

세련되고 약간 산업적인 이 쿨 그레이 컬러 팔레트 세트는 브러시드 스틸과 비 오는 보도를 연상시킵니다. 거칠게 느껴지지 않으면서 강한 대비를 제공하여 로고와 워드마크를 세련되게 유지합니다. CTA를 위해 단일 전기적 액센트를 추가하거나 프리미엄 룩을 위해 순수 중립을 유지하세요. 사용 팁: #1f2328로 로고를 고정하고 #eef1f4는 넉넉한 네거티브 스페이스로 유지하세요.

media.io를 사용하여 생성된 스틸 미스트 이미지 예시

3) 빙하 오피스

HEX: #f6f8fb #dfe6ee #b8c2ce #7a8796 #3b4450

분위기: 밝은, 정돈된, 미니멀한

최적 용도: 프레젠테이션 템플릿

밝고 정돈된 이 쿨 그레이 색상들은 선명한 가장자리를 가진 유리같은 빙하처럼 느껴집니다. 슬라이드를 넓어 보이게 유지하면서도 제목, 차트 및 콜아웃에 명확한 계층 구조를 제공합니다. 강조를 위해 음소거된 네이비 또는 슬레이트와 페어링하고 쿨 언더톤과 충돌할 수 있는 웜 오렌지는 피하세요. 사용 팁: 섹션 구분에 #dfe6ee를 사용하여 무거운 디바이더 없이 덱을 일관되게 유지하세요.

media.io를 사용하여 생성된 빙하 오피스 이미지 예시

4) 실버 세이지

HEX: #f3f5f6 #d2d9d8 #a9b5b0 #6f817a #2e3a35

분위기: 자연스러운, 편안한, 세련된

최적 용도: 스파 및 웰니스 패키징

부드럽고 식물적인 이 쿨 그레이 믹스는 은빛 먼지가 묻은 세이지 잎을 연상시킵니다. 부드러운 그린-그레이 노트는 패키징을 차분하고 깨끗하며 신뢰할 수 있게 만듭니다. 매트 화이트와 은은한 엠보싱과 페어링하거나 프리미엄 마감을 원한다면 음소거된 골드 포일을 추가하세요. 사용 팁: 평온한 분위기를 잃지 않으면서 가독성을 위해 성분 텍스트를 #2e3a35로 유지하세요.

media.io를 사용하여 생성된 실버 세이지 이미지 예시

5) 항구의 아침

HEX: #f0f3f7 #c8d2e0 #8ea2bb #4e647a #26313b

분위기: 해안의, 안정적인, 신선한

최적 용도: 웹사이트 히어로 섹션

시원하고 해안적인 이 블루와 그레이는 항구 위로 안개가 걷히는 것처럼 느껴집니다. 미드톤은 전문적인 느낌을 유지하면서 친근해 보이기에 충분한 색상을 제공합니다. 여전히 친근한 느낌의 쿨 그레이 컬러 조합을 찾고 있다면 버튼에 #8ea2bb를 사용하고 배경은 #f0f3f7로 유지하세요. 사용 팁: 평평한 히어로 영역을 피하기 위해 #c8d2e0에서 #f0f3f7로 은은한 그라디언트를 추가하세요.

media.io를 사용하여 생성된 항구의 아침 이미지 예시

6) 흑연과 구름

HEX: #f7f7f8 #d9dadd #b1b3b8 #575a61 #222327

분위기: 미니멀한, 대담한, 시대를 초월한

최적 용도: 에디토리얼 매거진 레이아웃

대담하고 시대를 초월한 이 중성 색조는 밝은 종이 위의 흑연 스케치를 연상시킵니다. 구름-화이트에서 거의 블랙에 이르는 범위는 타이포그래피와 그리드 시스템을 의도적으로 느껴지게 만듭니다. 인쇄물에서 프리미엄하게 보이는 쿨 그레이 컬러 팔레트가 필요할 때 헤드라인에 #222327을, 넉넉한 마진에 #d9dadd를 사용하세요. 사용 팁: 코팅된 용지에서 그레이가 더 부드럽게 읽힐 수 있으므로 평소보다 한 단계 더 무거운 웨이트를 사용하세요.

media.io를 사용하여 생성된 흑연과 구름 이미지 예시

7) 서리 낀 데님

HEX: #f4f7fb #d3dbe6 #9fb0c6 #5a6f8a #2b3644

분위기: 캐주얼한, 깔끔한, 접근하기 쉬운

최적 용도: 앱 온보딩 화면

깔끔하고 캐주얼한 이 쿨 그레이 컬러 스킴은 겨울 하늘 아래 연한 워시드 데님처럼 느껴집니다. 더 부드러운 블루는 시각적 압박 없이 안내를 원하는 온보딩 플로우에 잘 작동합니다. 화이트 스페이스와 둥근 카드와 페어링한 다음 명확한 단계 제목에 #2b3644를 사용하세요. 사용 팁: 단계별로 화면이 일관되게 유지되도록 일러스트레이션을 두 가지 톤(#9fb0c6과 #5a6f8a)으로 유지하세요.

media.io를 사용하여 생성된 서리 낀 데님 이미지 예시

8) 고요한 라벤더

HEX: #f5f3f8 #d9d3e3 #b2a9c5 #6f6588 #2e2a3a

분위기: 부드러운, 몽환적인, 우아한

최적 용도: 웨딩 초대장 세트

부드럽고 몽환적인 이 쿨 그레이 톤은 라벤더 황혼과 새틴 리본을 떠올리게 합니다. 바이올렛-그레이 믹스는 지나치게 달콤하지 않으면서 로맨틱하여 현대적인 문구류에 훌륭합니다. 따뜻한 화이트 용지와 섬세한 세리프와 페어링하고 색상이 숨 쉴 수 있도록 장식을 최소화하세요. 사용 팁: 큰 블록은 #f5f3f8로 인쇄하고 대비를 선명하게 유지하기 위해 이름과 주요 세부 사항에는 #2e2a3a를 사용하세요.

media.io를 사용하여 생성된 고요한 라벤더 이미지 예시

9) 폴라 피치

HEX: #f7f4f3 #dad6d6 #a9a3a6 #5c5960 #f2b7a6

분위기: 따뜻함-차가움 균형, 부드러운, 현대적인

최적 용도: 소셜 미디어 인용구 템플릿

부드럽고 현대적인 이 쿨 그레이 쉐이드는 블러시 하이라이트가 있는 부드러운 니트웨어처럼 느껴집니다. 피치 액센트는 그레이가 차갑게 보이는 것을 방지하여 친근한 콘텐츠에 완벽합니다. 단순한 기하학적 형태와 페어링하고 가독성을 위해 #5c5960가 타입을 처리하도록 하세요. 사용 팁: 피드가 일관되게 유지되도록 피치는 강조 단어나 아이콘에만 사용하세요.

media.io를 사용하여 생성된 polar peach의 이미지 예시

10) 슬레이트 틸

HEX: #f1f4f5 #cfd7db #95a7ad #4b666f #1f3c42

분위기: 자신감 있는, 상쾌한, 구조적인

최적 용도: B2B 랜딩 페이지

자신감 있고 상쾌한 이 쿨 그레이 색상 조합은 슬레이트 돌과 깊은 물을 연상시킵니다. 틸 계열의 그레이는 비즈니스에 적합하면서도 개성을 더합니다. 선명한 라인 아이콘과 충분한 여백과 함께 사용하고, CTA와 고정 헤더에는 #1f3c42를 사용하세요. 사용 팁: 양식 필드는 #cfd7db로 유지하여 무거운 외곽선 없이도 명확하게 읽히도록 하세요.

media.io를 사용하여 생성된 slate teal의 이미지 예시

11) 윈터 모스

HEX: #f3f6f4 #d7dfdb #aabbb1 #667a70 #2f3d37

분위기: 자연스러운, 조용한, 안정감 있는

최적 용도: 친환경 제품 라벨 디자인

자연스럽고 조용한 이 쿨 그레이 색상 팔레트는 서리 아래 이끼와 그늘진 소나무 같은 느낌입니다. 시끄러운 녹색 없이 자연적인 느낌을 원하는 지속 가능한 브랜딩에 적합합니다. 재활용 종이 질감과 미니멀 아이콘과 함께 사용하고, 안정감 있는 마무리를 위해 본문은 #2f3d37로 유지하세요. 사용 팁: 순수한 검은색 외곽선을 피하고 부드러움을 유지하기 위해 선에는 #667a70을 사용하세요.

media.io를 사용하여 생성된 winter moss의 이미지 예시

12) 문릿 코퍼

HEX: #f6f5f4 #d8d6d4 #a5a2a0 #555352 #b46a52

분위기: 고급스러운, 아늑한, 세련된

최적 용도: 제품 광고 크리에이티브

고급스럽고 아늑한 이 쿨 그레이 색조는 따뜻한 구리 광택이 있는 금속 위의 달빛을 연상시킵니다. 따뜻한 강조색이 깊이를 더하면서도 베이스는 세련되고 현대적으로 유지됩니다. 럭셔리한 느낌의 쿨 그레이 색상 조합을 원한다면 배지나 가격 태그 같은 작은 하이라이트에 #b46a52를 사용하세요. 사용 팁: 그림자를 중성색(#555352)으로 유지하여 구리색이 다른 화면에서 주황색으로 변하지 않도록 하세요.

media.io를 사용하여 생성된 moonlit copper의 이미지 예시

13) 스토미 미니멀

HEX: #fafafa #e1e2e5 #b9bbc1 #70737c #2b2d33

분위기: 선명한, 미니멀한, 고대비

최적 용도: 포트폴리오 웹사이트

선명하고 미니멀한 이 쿨 그레이 색상 구성은 깨끗한 낮으로 부서지는 폭풍 구름 같은 느낌입니다. 대비가 갤러리와 사례 연구에 충분히 강하면서도 순수한 흑백보다 부드럽게 읽힙니다. 링크에는 하나의 시그니처 강조색과 함께 사용하고, 중성색이 경쟁하지 않도록 이미지를 실제와 같이 유지하세요. 사용 팁: 무거운 테두리 없이 스크롤을 안내하기 위해 섹션 밴드에 #e1e2e5를 사용하세요.

media.io를 사용하여 생성된 stormy minimal의 이미지 예시

14) 잉크 앤 아이스

HEX: #f2f6f8 #cbd7dd #8da0aa #41545e #0f1a22

분위기: 선명한, 진지한, 편집적인

최적 용도: 연례 보고서 디자인

선명하고 진지한 이 쿨 그레이 톤은 얼음 같은 종이 위의 잉크와 깔끔한 인포그래픽을 연상시킵니다. 더 짙은 네이비 블랙은 차트, 표, 인용구가 있는 대형 문서에 구조를 제공합니다. 절제된 사진과 #8da0aa의 얇은 선과 함께 사용하여 페이지를 가볍게 유지하세요. 사용 팁: 순수한 검은색에 비해 눈부심을 줄이기 위해 긴 본문 텍스트는 #41545e로 설정하세요.

media.io를 사용하여 생성된 ink and ice의 이미지 예시

15) 어반 블러시

HEX: #f6f2f4 #ded5da #b7a4ac #6e5b63 #c07b8f

분위기: 시크한, 부드러운, 대도시적인

최적 용도: 패션 룩북

시크하고 대도시적인 이 쿨 그레이 팔레트는 핑크빛 콘크리트와 새틴 안감 같은 느낌입니다. 더스티 로즈 강조색은 중성 베이스를 압도하지 않으면서 개성을 더합니다. 런웨이 편집 분위기를 위해 미니멀리스트 사진 블록과 가는 선 타이포그래피와 함께 사용하세요. 사용 팁: 레이아웃이 세련되게 유지되도록 #c07b8f는 작은 제목이나 섹션 탭에만 사용하세요.

media.io를 사용하여 생성된 urban blush의 이미지 예시

16) 모던 모노크롬

HEX: #ffffff #e5e6e8 #b9bbbf #6c6f76 #101114

분위기: 클래식한, 자신감 있는, 매우 깔끔한

최적 용도: 로고 및 아이콘 시스템

클래식하고 매우 깔끔한 이 쿨 그레이 색상 조합은 완벽한 조명의 갤러리 벽 같은 느낌입니다. 흰색에서 거의 검은색까지의 단계는 아이콘, 마크, UI 구성 요소를 표준화하기 쉽게 만듭니다. 크기에 관계없이 확장 가능한 쿨 그레이 색상 팔레트가 필요할 때 보조 선에는 #b9bbbf를, 주요 형태에는 #101114를 사용하세요. 사용 팁: 시스템이 예측 가능하도록 비활성 상태에는 단일 그레이(#6c6f76)를 정의하세요.

media.io를 사용하여 생성된 modern monochrome의 이미지 예시

17) 노르딕 샌드

HEX: #f6f3ef #ded9d2 #b4aea6 #7a746d #3a3835

분위기: 따뜻한 중성, 차분한, 편안한

최적 용도: 인테리어 디자인 무드보드

차분하고 편안한 이 중성색은 옅은 모래, 돌, 부드러운 양모를 연상시킵니다. 약간의 따뜻함이 공간을 현대적이고 정돈된 느낌으로 유지하면서도 환영하는 느낌을 줍니다. 깊이를 위해 밝은 참나무, 브러시드 니켈, 질감 있는 린넨과 함께 사용하세요. 사용 팁: 공간이 너무 베이지로 흐르지 않도록 프레임이나 하드웨어에 하나의 더 깊은 앵커(#3a3835)로 팔레트를 균형있게 하세요.

media.io를 사용하여 생성된 nordic sand의 이미지 예시

18) 블루 아워 슬레이트

HEX: #eef2f7 #c3cedd #7d91ab #3a4f67 #141b26

분위기: 분위기 있는, 현대적인, 영화 같은

최적 용도: 음악 포스터 디자인

분위기 있고 영화 같은 이 쿨 그레이 색조는 도시 스카이라인 위로 내려앉는 블루 아워 같은 느낌입니다. 짙은 네이비 앵커는 포스터에 강한 가독성을 제공하면서 밝은 색조는 그라데이션을 부드럽게 유지합니다. 굵은 산세리프 타입과 미니멀 형태와 함께 사용하고, 의도적인 긴장감을 원하지 않는 한 따뜻한 노란색은 피하세요. 사용 팁: 배경을 #141b26에서 #3a4f67로 그라데이션으로 설정하여 어수선함 없이 깊이를 표현하세요.

media.io를 사용하여 생성된 blue hour slate의 이미지 예시

19) 라일락 크롬

HEX: #f4f2f7 #d6d2df #a59db6 #5d556f #26222f

분위기: 미래적인, 부드러운, 세련된

최적 용도: 뷰티 앱 UI

미래적이면서도 부드러운 이 쿨 그레이 톤은 라일락빛 크롬과 벨벳 그림자를 연상시킵니다. 퍼플 그레이 방향은 우아함이 필요한 뷰티 및 라이프스타일 인터페이스에 아름답게 작동합니다. 미니멀 제품 사진 및 미묘한 그라데이션과 함께 사용하고, 선명한 라벨에는 #26222f를 사용하세요. 사용 팁: 강렬하지 않으면서 대비를 유지하기 위해 버튼은 #5d556f에 #f4f2f7 텍스트를 사용하세요.

media.io를 사용하여 생성된 lilac chrome의 이미지 예시

20) 크리스프 민트 그레이

HEX: #f1f6f5 #d0dfdb #9fbdb4 #5b7f77 #2a3c38

분위기: 신선한, 깔끔한, 조용히 활기찬

최적 용도: 커피숍 메뉴 디자인

신선하고 조용히 활기찬 이 쿨 그레이 색상 구성은 차가운 돌 위의 민트 잎 같은 느낌입니다. 그린 그레이 톤은 메뉴를 깔끔하게 유지하면서도 시그니처 개성을 더합니다. 인쇄물에서 현대적으로 읽히는 쿨 그레이 색상 조합을 원한다면 제목에는 #2a3c38을, 카테고리 하이라이트에는 #9fbdb4를 사용하세요. 사용 팁: 배경은 #f1f6f5로 유지하고 강조 블록을 제한하여 항목을 쉽게 스캔할 수 있도록 하세요.

media.io를 사용하여 생성된 crisp mint gray의 이미지 예시

쿨 그레이와 잘 어울리는 색상은?

쿨 그레이는 틸, 슬레이트 블루, 아이시 시안, 딥 네이비 같은 쿨 강조색과 자연스럽게 어울립니다. 이들은 온도를 일관되게 유지하고 인터페이스나 레이아웃을 "기본값"이 아닌 의도적으로 느껴지게 만듭니다.

대비와 따뜻함을 위해 구리, 블러시, 소프트 피치 같은 절제된 하이라이트를 추가하세요. 버튼, 배지, 제목 또는 주요 데이터 포인트에 초점을 만들기 위해서는 보통 소량으로 충분합니다.

모든 것을 중성으로 유지하고 싶다면 여러 그레이를 레이어링하고 진정한 검은색 대신 거의 검은색 또는 블루 블랙으로 고정하세요. 이것은 차분하고 현대적인 모습을 유지하면서 가독성을 향상시킵니다.

실제 디자인에서 쿨 그레이 컬러 팔레트를 사용하는 방법

견본이 아닌 역할로 시작하세요: 밝은 배경 하나, 카드/섹션용 표면 그레이 하나, 테두리 및 보조 텍스트용 중간 그레이 하나, 제목 및 UI 컨트롤용 깊은 앵커 하나를 선택하세요. 이것은 확장 가능한 시스템을 만듭니다.

인쇄물과 브랜딩에서 쿨 그레이는 넉넉한 여백과 강한 타이포그래피 계층 구조와 함께 가장 잘 보입니다. 그레이는 종이에서 더 부드럽게 느껴질 수 있으므로 특히 본문 텍스트와 가는 선의 경우 대비를 의도적으로 유지하세요.

인테리어의 경우 쿨 그레이를 질감(린넨, 울, 스톤)과 혼합하여 공간이 평평하게 읽히지 않도록 하세요. 팔레트가 지나치게 무균 상태로 느껴지지 않도록 브러시드 메탈, 다크 우드 또는 뮤티드 컬러 같은 강조 소재를 하나 추가하세요.

AI로 쿨 그레이 팔레트 비주얼 만들기

대시보드, 포스터, 패키징 목업 또는 인테리어 무드보드에서 쿨 그레이 색상 구성이 어떻게 보이는지 미리 보려면 AI 비주얼이 커밋하기 전에 대비와 분위기를 검증하는 데 도움이 될 수 있습니다.

Media.io의 텍스트-이미지 도구를 사용하면 프롬프트를 붙여넣고 종횡비를 지정하며 정확한 HEX 색상을 가이드로 사용하여 브랜딩 시스템 또는 UI 플로우에 대한 일관된 예제를 생성할 수 있습니다.

여러 쿨 그레이 색상 조합을 테스트하고 청중과 매체에 적합한 것을 선택하는 빠른 방법입니다.

다음: 마법의 정원 컬러 팔레트