딤 그레이는 순수한 검은색의 거친 느낌 없이 구조를 제공하는 현대적인 중립 색상입니다. UI, 브랜딩 및 인테리어에서 깔끔한 타이포그래피, 안정적인 레이아웃 및 차분한 시각적 계층 구조를 지원합니다.
아래는 HEX 코드가 포함된 20개 이상의 딤 그레이 컬러 팔레트 아이디어와 함께 액센트 페어링, 가독성 있는 대비 유지 및 팔레트를 실제 디자인 시스템으로 전환하는 실용적인 가이드입니다.
이 글의 내용
딤 그레이 팔레트가 잘 작동하는 이유
딤 그레이는 강렬한 검은색과 부드러운 라이트 그레이 사이의 최적 지점에 위치하므로 콘텐츠를 압도하지 않으면서 내비게이션, 제목 및 UI 크롬을 전달할 수 있습니다. 이러한 균형은 디자인을 구성적이고 의도적으로 느껴지게 합니다.
중립적이기 때문에 딤 그레이는 따뜻한 액센트(샌드, 테라코타, 골드) 또는 차가운 액센트(틸, 슬레이트 블루, 민트)와 쉽게 조화를 이룹니다. 동일한 신뢰할 수 있는 기반을 유지하면서 분위기를 극적으로 바꿀 수 있습니다.
또한 화면과 인쇄물 전반에 걸쳐 일관성을 유지하는 데 도움이 됩니다. 딤 그레이는 "순수한 검은색"의 대비 충격을 줄이며 큰 블록, 배경 및 타이포그래피 중심 레이아웃에서 더 세련되게 보이는 경향이 있습니다.
20개 이상의 딤 그레이 컬러 팔레트 아이디어 (HEX 코드 포함)
1) 어반 포그

HEX: #696969 #2F343A #BFC5CC #F2F1ED #C7A27C
분위기: 조용한, 대도시의, 세련된
최적 용도: 기술 제품을 위한 랜딩 페이지 UI
조용한 도시 안개와 브러시 처리된 콘크리트가 떠오르며 따뜻한 샌드 액센트로 부드러워집니다. 명확성이 과장보다 중요한 대시보드 및 SaaS 랜딩 페이지에 적합합니다. 토프 하이라이트를 버튼이나 주요 지표에 사용하고 제목은 짙은 차콜로 유지하세요. 사용 팁: 흐릿한 대비를 피하기 위해 탄 색상을 하나의 주요 액션에만 사용하세요.
media.io를 사용하여 생성된 어반 포그의 이미지 예시
Media.io는 브라우저에서 비디오, 이미지 및 오디오를 생성하고 편집하는 온라인 AI 스튜디오입니다.
2) 스톤 앤 세이지

HEX: #696969 #3E4247 #A9B7A5 #E7E3DA #7B6D5D
분위기: 안정적인, 자연스러운, 회복적인
최적 용도: 스파 브랜드 아이덴티티 및 패키징
안정적인 스톤 톤이 부드러운 세이지 노트를 만나 차분한 목욕탕 인테리어와 같습니다. 신뢰와 차분함을 원하는 웰니스 브랜딩, 라벨 및 미니멀 패키징에 아름답게 작동합니다. 세이지를 씰이나 콜아웃의 히어로 액센트로 유지하고 그레이가 타이포그래피를 처리하도록 하세요. 사용 팁: 유기적인 느낌을 향상시키기 위해 라이트 크림을 코팅되지 않은 용지로 인쇄하세요.
media.io를 사용하여 생성된 스톤 앤 세이지의 이미지 예시
3) 뮤지엄 미니멀

HEX: #696969 #1F2328 #D9D3C7 #FFFFFF #8B7E74
분위기: 갤러리처럼 깨끗한, 세련된, 조용한 럭셔리
최적 용도: 에디토리얼 매거진 레이아웃
갤러리 벽, 조용한 활자, 큐레이팅된 고요함이 분위기를 정의합니다. 이 딤 그레이 컬러 팔레트는 여백과 우아한 계층 구조에 의존하는 에디토리얼 스프레드와 룩북에 적합합니다. 제목에는 거의 검은색을 사용하고 풀 쿼트에는 따뜻한 그레이지를 사용하여 페이지가 차갑게 느껴지지 않도록 하세요. 사용 팁: 레이아웃이 뮤지엄과 같이 유지되도록 캡션에는 하나의 액센트 규칙을 고수하세요.
media.io를 사용하여 생성된 뮤지엄 미니멀의 이미지 예시
4) 코코아 스모크

HEX: #696969 #3B2F2A #8A6F5A #E9DFD3 #171717
분위기: 분위기 있는, 아늑한, 친밀한
최적 용도: 커피숍 메뉴 디자인
스모키한 에스프레소 톤과 따뜻한 코코아가 아늑한 심야 카페 분위기를 연출합니다. 가독성이 강해야 하는 메뉴와 소형 인쇄물에 이상적입니다. 본문 텍스트에는 크림 배경을 사용하고 섹션 헤더 및 가격에는 짙은 갈색을 사용하세요. 사용 팁: 어두운 색상이 평평하게 느껴지지 않도록 미묘한 종이 질감을 추가하세요.
media.io를 사용하여 생성된 코코아 스모크의 이미지 예시
5) 코스탈 오버캐스트

HEX: #696969 #4A6572 #9FB7C3 #F5F7F8 #D2B48C
분위기: 신선한, 통풍이 잘 되는, 차분한
최적 용도: 여행 블로그 헤더 및 썸네일
바닷가의 흐린 하늘은 깨끗한 아이스 화이트 베이스 덕분에 우울하기보다는 통풍이 잘 됩니다. 이 믹스는 조용한 컬러 스토리가 필요한 여행 헤더, 썸네일 시스템 및 콘텐츠 카드에 적합합니다. 링크와 작은 UI 하이라이트에는 블루 그레이를 사용하고 탄을 부드러운 배지 색상으로 유지하세요. 사용 팁: 팔레트가 안개 같고 편안하게 유지되도록 채도가 높은 파란색을 제한하세요.
media.io를 사용하여 생성된 코스탈 오버캐스트의 이미지 예시
6) 네온 사인 더스크

HEX: #696969 #1B1D22 #FF4FA3 #6C5CE7 #F3F3F3
분위기: 활기찬, 나이트라이프, 현대적인 엣지
최적 용도: 일렉트로닉 음악 나이트를 위한 이벤트 포스터
나이트라이프 더스크 에너지는 깊고 스모키한 중립 색상에 대비되는 강렬한 핑크와 바이올렛에서 나타납니다. 이 딤 그레이 컬러 조합은 대비가 빠르게 주목을 끌어야 하는 이벤트 포스터와 소셜 그래픽에서 빛을 발합니다. 그레이를 무대로 유지하고 제목에는 핑크를 사용하고 바이올렛은 보조 세부 사항을 지원합니다. 사용 팁: 인쇄에서 밴딩을 제어할 수 없다면 그라디언트를 피하세요.
media.io를 사용하여 생성된 네온 사인 더스크의 이미지 예시
7) 리넨 스튜디오

HEX: #696969 #8E8A84 #DCD6CC #FAF7F2 #B58B6A
분위기: 부드러운, 촉각적인, 수제
최적 용도: 미니멀한 제품 사진 배경 스타일링
부드러운 린넨과 스튜디오 자연광이 이 세트에 차분하고 수제 같은 톤을 부여합니다. 따뜻하고 자연스러운 기조를 가진 중립 표면을 원하는 제품 촬영에 적합합니다. 따뜻한 탄을 소품 액센트(리본, 라벨, 작은 카드)로 사용하고 오프 화이트가 대부분의 프레임을 차지하도록 하세요. 사용 팁: 그레이가 금속이 아닌 직물로 읽히도록 그림자를 부드럽게 유지하세요.
media.io를 사용하여 생성된 리넨 스튜디오의 이미지 예시
8) 아틱 스틸

HEX: #696969 #22313F #A7B1B7 #E6EEF3 #00A6A6
분위기: 선명한, 기술적인, 자신감 있는
최적 용도: 데이터 대시보드 UI
선명한 스틸과 얼음 같은 라이트 그레이가 기술적이고 신뢰할 수 있으며 깨끗한 틸 신호 색상을 느끼게 합니다. 상태와 지표에 명확한 강조가 필요한 분석 대시보드 및 핀테크 도구에 적합합니다. 차트와 토글에는 틸을 사용하고 내비게이션에는 가장 어두운 네이비를 유지하세요. 사용 팁: 미드 그레이가 저가시성이 되지 않도록 작은 타입의 대비를 테스트하세요.
media.io를 사용하여 생성된 아틱 스틸의 이미지 예시
9) 블러시 콘크리트

HEX: #696969 #4C4C4C #F2C6C2 #FFF4F3 #B07A7A
분위기: 부드러운, 현대적인, 친근한
최적 용도: 뷰티 브랜드 소셜 템플릿
콘크리트 위의 부드러운 블러시는 현대적이면서도 친근하게 느껴지며, 장미빛 광채가 있는 미니멀리스트 스튜디오 같습니다. 뷰티 소셜 템플릿, 제품 콜아웃 및 간단한 프로모션에 적합합니다. 블러시를 큰 블록에 사용하고 더 진한 로즈를 작은 태그에 사용하여 그레이가 모든 것을 안정적으로 유지하도록 합니다. 사용 팁: 핑크가 칙칙해 보이지 않도록 배경을 거의 흰색에 가깝게 유지하세요.
media.io를 사용하여 생성된 블러시 콘크리트 이미지 예시
10) 포레스트 슬레이트

HEX: #696969 #2A3A2E #6F8F72 #E3E7E0 #C7B299
분위기: 아웃도어, 안정적, 건강한
최적 용도: 친환경 브랜드 웹사이트
슬레이트 그레이 위에 겹쳐진 포레스트 그린은 하이킹 트레일과 재활용 종이 라벨을 연상시킵니다. 실용적이면서도 설교조가 아닌 느낌을 원하는 지속 가능한 브랜드에 적합합니다. 에버그린을 헤더와 아이콘에 사용하고 연한 회녹색을 기본 페이지 배경으로 사용하세요. 사용 팁: 그린이 너무 차갑게 보이지 않도록 따뜻한 베이지를 절제해서 추가하세요.
media.io를 사용하여 생성된 포레스트 슬레이트 이미지 예시
11) 골든 아워 아스팔트

HEX: #696969 #2D2D2D #F0B429 #F7E7C6 #8C6A3B
분위기: 대담한, 따뜻한, 도시적
최적 용도: 스타트업 피치 덱 슬라이드
아스팔트를 가로지르는 따뜻한 골든 아워 빛은 자신감 있고 도시적인 펀치를 제공합니다. 권위와 약간의 낙관주의를 원하는 피치 덱과 키노트 슬라이드에 이상적입니다. 노란색을 하이라이트와 주요 숫자에 사용하고 더 어두운 중성 톤으로 그리드를 구성하세요. 사용 팁: 노란색이 압도하지 않도록 크림을 메인 캔버스로 사용하세요.
media.io를 사용하여 생성된 골든 아워 아스팔트 이미지 예시
12) 네이비 테일러드

HEX: #696969 #0F1B2D #2B3A55 #E9EDF2 #C6A15B
분위기: 전문적, 맞춤형, 프리미엄
최적 용도: 법률 회사 브랜딩
테일러드 네이비와 조용한 그레이는 브러시드 브라스 핀이 달린 잘 재단된 정장처럼 느껴집니다. 구식으로 보이지 않으면서 신뢰성이 필요한 법률 및 컨설팅 브랜드에 적합합니다. 브라스-골드를 씰이나 구분선에 사용하고 네이비를 내비게이션과 헤드라인에 유지하세요. 사용 팁: 골드를 본문 텍스트에 사용하지 말고 마무리 디테일로 취급하세요.
media.io를 사용하여 생성된 네이비 테일러드 이미지 예시
13) 테라코타 로프트

HEX: #696969 #3C3532 #C76B4B #F3E6DC #8C8A84
분위기: 따뜻한, 창의적, 살아있는
최적 용도: 인테리어 디자인 무드 보드
로프트 환경의 따뜻한 테라코타는 큰 창가의 점토 화분처럼 창의적이고 매력적으로 느껴집니다. 인테리어, 무드 보드 및 홈 데코 포스트에 강력한 선택입니다. 테라코타를 부드러운 크림과 벽이나 배경에 사용하고 딤 톤을 가구 실루엣에 유지하세요. 사용 팁: 통일감을 위해 디자인 전체에 테라코타를 소량씩 반복하세요.
media.io를 사용하여 생성된 테라코타 로프트 이미지 예시
14) 아이리스 앤 잉크

HEX: #696969 #24243A #6F7BF7 #EDEEFF #B9B0D9
분위기: 몽환적, 현대적, 약간 미래적
최적 용도: 모바일 앱 온보딩 화면
아이리스 빛이 있는 잉크 그림자는 서리가 낀 유리를 통해 빛나는 황혼처럼 몽환적으로 느껴집니다. 이 딤 그레이 컬러 팔레트는 차분한 움직임과 명확한 단계를 원하는 온보딩 플로우에 적합합니다. 페리윙클을 진행 표시기와 마이크로 인터랙션에 사용하고 거의 흰색에 가까운 색을 콘텐츠 카드에 유지하세요. 사용 팁: 순수한 검은색 대신 미드 라벤더를 부드러운 그림자 대체로 사용하세요.
media.io를 사용하여 생성된 아이리스 앤 잉크 이미지 예시
15) 모노크롬 워크샵

HEX: #696969 #111111 #4D4D4D #CFCFCF #F8F8F8
분위기: 산업적, 집중된, 실용적
최적 용도: 사진작가를 위한 포트폴리오 웹사이트
산업적 모노크롬은 프린트와 컨택트 시트로 덮인 워크샵 벽처럼 느껴집니다. UI는 보이지 않게 유지하면서 이미지가 주도해야 하는 포트폴리오에 완벽합니다. 가장 어두운 검은색을 내비게이션에 사용하고 연한 회색을 간격과 구분선에 사용하세요. 사용 팁: 작업이 주인공으로 남도록 호버 상태를 미묘하게 유지하세요.
media.io를 사용하여 생성된 모노크롬 워크샵 이미지 예시
16) 민트 메트로

HEX: #696969 #30363B #7FD1B9 #E9FAF5 #F4C95D
분위기: 신선한, 밝은, 현대적
최적 용도: 핀테크 앱 마케팅 배너
메트로 그레이에 대비되는 신선한 민트는 유리에 부딪히는 햇빛과 깨끗한 통근처럼 현대적이고 낙관적으로 느껴집니다. 신뢰와 에너지를 모두 원하는 핀테크 배너와 기능 콜아웃에 적합합니다. 민트를 기본 모양에 사용하고 노란색을 배지나 요율에 작은 불꽃으로 유지하세요. 사용 팁: 민트가 시끄럽지 않고 선명하게 유지되도록 충분한 여백을 제공하세요.
media.io를 사용하여 생성된 민트 메트로 이미지 예시
17) 로즈우드 이브닝

HEX: #696969 #2B2024 #6E3B3B #EAD7D7 #D1A054
분위기: 로맨틱한, 극적인, 우아한
최적 용도: 웨딩 초대장 세트
로즈우드와 딤 라이트는 촛불에 비친 벨벳처럼 로맨틱하고 극적으로 느껴집니다. 약간 현대적인 엣지가 있는 초대장 세트와 공식 문구류에 적합합니다. 더스티 블러시 배경을 딥 와인 텍스트와 짝지어 사용하고 골드를 이름이나 테두리의 포일 스타일 하이라이트로 사용하세요. 사용 팁: 디자인이 세련되게 유지되도록 골드 액센트를 얇게 유지하세요.
media.io를 사용하여 생성된 로즈우드 이브닝 이미지 예시
18) 클레이 앤 그래파이트

HEX: #696969 #2E2A28 #B38B6D #EFE7DD #6F5E53
분위기: 자연적, 수공예적, 안정적
최적 용도: 도자기 상점 포장 라벨
자연적인 클레이와 그래파이트는 조용한 아침에 그릇을 다듬는 도예가처럼 수제 느낌을 줍니다. 질감이 스토리의 일부인 라벨, 태그 및 소형 포장에 적합합니다. 따뜻한 클레이를 라벨 베이스의 크림과 짝지어 사용하고 그래파이트를 선명한 타입에 사용하세요. 사용 팁: 수공예 분위기를 강화하기 위해 미드 브라운으로 간단한 스탬프 마크를 추가하세요.
media.io를 사용하여 생성된 클레이 앤 그래파이트 이미지 예시
19) 시트러스 콘크리트

HEX: #696969 #333333 #D7E04B #F5F6E8 #A3A7AA
분위기: 밝은, 유쾌한, 현대적
최적 용도: 스포츠웨어 제품 광고
시트러스 팝이 있는 콘크리트 중성색은 깨끗한 스튜디오의 신선한 운동화 드롭처럼 스포티하고 현대적으로 느껴집니다. 네온 카오스로 변하지 않으면서 펀치가 필요한 제품 광고에 탁월합니다. 배-라임 액센트를 주요 혜택에 사용하고 연한 오프화이트를 네거티브 스페이스에 유지하세요. 사용 팁: 최대 임팩트를 위해 레이아웃당 하나의 초점 요소에 라임을 사용하세요.
media.io를 사용하여 생성된 시트러스 콘크리트 이미지 예시
20) 윈터 보타니컬

HEX: #696969 #46505A #8AA0A6 #F1F4F6 #B7A18B
분위기: 시원한, 섬세한, 공기 같은
최적 용도: 수채화 식물 일러스트레이션 세트
시원한 겨울 식물은 일기장에 눌린 연한 잎사귀처럼 섬세하게 느껴집니다. 이 딤 그레이 컬러 조합은 구조를 잃지 않으면서 부드러움을 원하는 일러스트레이션 세트와 문구류에 적합합니다. 청회색을 줄기와 그림자에 사용하고 가장 밝은 톤을 종이 워시로 유지하세요. 사용 팁: 베이지를 미묘한 씨앗 꼬투리로 나타나게 하여 구성을 따뜻하게 하세요.
media.io를 사용하여 생성된 윈터 보타니컬 이미지 예시
21) 코퍼 서킷

HEX: #696969 #202225 #B87333 #E6E6E6 #4B6E77
분위기: 산업적, 하이테크, 프리미엄
최적 용도: 하드웨어 제품 포장
어두운 그래파이트 위의 코퍼는 책상 램프 아래의 회로처럼 산업적이지만 프리미엄으로 느껴집니다. 따뜻함이 있는 기술적인 룩을 원하는 하드웨어 포장과 사양서에 적합합니다. 코퍼를 작은 선과 아이콘에 사용하고 연한 회색을 읽기 쉬운 패널에 사용하세요. 사용 팁: 음소거된 틸을 변형을 구성하기 위한 보조 라벨 색상으로 반복하세요.
media.io를 사용하여 생성된 코퍼 서킷 이미지 예시
딤 그레이와 잘 어울리는 색상은?
딤 그레이는 매력적이고 인간적인 느낌을 원할 때 샌드, 토프, 크림, 테라코타와 같은 따뜻한 중성색과 잘 어울립니다. 이러한 액센트는 팔레트가 차갑거나 지나치게 산업적으로 읽히는 것을 방지합니다.
선명하고 현대적인 룩을 위해 딤 그레이를 틸, 슬레이트 블루, 민트 또는 아이시 오프화이트와 같은 쿨 톤과 결합하세요. 이 방향은 명확성에 의존하는 대시보드, SaaS 및 에디토리얼 레이아웃에 특히 효과적입니다.
높은 에너지가 필요한 경우 하나의 밝은 "신호" 색상(네온 핑크, 배-라임 또는 골든 옐로우)을 추가하고 나머지는 모두 음소거된 상태로 유지하세요. 핵심은 절제입니다. 통제된 그레이에 대한 하나의 큰 액센트는 혼란스럽지 않고 프리미엄으로 읽힙니다.
실제 디자인에서 딤 그레이 컬러 팔레트를 사용하는 방법
역할을 할당하는 것부터 시작하세요: 딤 그레이를 본문 텍스트나 UI 구조에 사용하고, 거의 검은색에 가까운 색을 제목에 사용하고, 연한 회색이나 오프화이트를 메인 배경에 사용합니다. 그런 다음 액센트 색상을 기본 액션, 하이라이트 및 주요 데이터용으로 예약하세요.
특히 딤 그레이가 미드 그레이 배경 위에 있을 때 대비를 주의 깊게 관찰하세요. 가독성을 위해 텍스트를 더 어둡게 하거나 표면을 더 밝게 밀고 여러 화면에서 작은 타입을 테스트하세요.
브랜딩과 인쇄의 경우 질감과 종이 선택을 고려하세요: 코팅되지 않은 스톡, 미묘한 그레인 및 무광 마감은 딤 그레이가 촉각적이고 세련되게 느껴지도록 돕습니다. 시스템이 통일성을 유지하도록 터치포인트 전반에 걸쳐 액센트 색상을 일관되게 유지하세요.
AI로 딤 그레이 팔레트 비주얼 만들기
랜딩 페이지, 포스터, 포장 목업 또는 무드 보드에서 딤 그레이 색상 구성표가 어떻게 보이는지 미리 보고 싶으신가요? 텍스트 프롬프트에서 빠른 컨셉 비주얼을 생성하고 대비와 분위기가 적절하게 느껴질 때까지 반복하세요.
형식(UI, 인쇄, 제품 샷), 조명 및 재료를 설명한 다음 팔레트 큐(주요 딤 그레이, 액센트 색상, 배경 톤)를 포함하세요. 이렇게 하면 프로덕션 자산을 디자인하기 전에 아이디어를 검증하기가 더 쉬워집니다.
딤 그레이 컬러 팔레트 FAQ
-
딤 그레이의 HEX 코드는 무엇입니까?
표준 웹 "dimgray" 색상은 #696969입니다. 타이포그래피, UI 구조 및 중성 배경에 잘 작동하는 균형 잡힌 중간에서 어두운 회색입니다. -
딤 그레이가 텍스트에 순수한 검은색보다 낫습니까?
대부분 그렇습니다. 딥 그레이는 밝은 화면에서 거친 대비와 눈의 피로를 줄이면서도 여전히 가독성을 유지할 수 있습니다. 특히 큰 텍스트, 제목 및 UI 레이블에 효과적입니다(작은 본문 텍스트의 경우 대비를 확인하세요). -
딥 그레이와 가장 잘 어울리는 강조 색상은 무엇인가요?
샌드, 테라코타, 골드와 같은 따뜻한 강조색은 편안함을 더하고, 틸, 슬레이트 블루, 민트와 같은 차가운 강조색은 깨끗하고 기술적인 느낌을 주며, 핑크나 페어 라임과 같은 하나의 선명한 강조색을 절제되게 사용하면 강한 강조 효과를 만들 수 있습니다. -
딥 그레이 팔레트가 "칙칙해" 보이지 않게 하려면 어떻게 해야 하나요?
주요 제목에 거의 검은색에 가까운 색을 사용하여 대비를 높이고, 여백을 위해 오프화이트 배경을 사용하며, 강조색을 모든 곳에 분산시키는 대신 초점 포인트(버튼, 배지, 하이라이트)에 하나의 강조색을 도입하세요. -
딥 그레이가 브랜드 아이덴티티에 효과적일 수 있나요?
네. 딥 그레이는 안정성과 세련됨을 전달하므로 전문적인 브랜드의 강력한 기본색이 됩니다. 민트, 브라스 골드, 블러시 또는 코퍼와 같은 독특한 강조색과 조합하여 기억에 남는 아이덴티티를 만드세요. -
UI 디자인에서 딥 그레이를 사용하는 가장 좋은 방법은 무엇인가요?
보조 텍스트, 테두리, 아이콘 또는 내비게이션 영역에 사용하고, 주요 콘텐츠 배경에는 더 밝은 중립색을 사용하세요. 기본 작업 및 상태 표시에는 단일 고대비 강조색을 예약하세요. -
디자인하기 전에 딥 그레이 팔레트 아이디어를 빠르게 시각화하려면 어떻게 해야 하나요?
AI 텍스트-이미지 도구를 사용하여 팔레트와 재질을 지정하는 프롬프트로 목업(UI 화면, 포스터, 패키징, 인테리어)을 생성한 다음 가독성과 분위기를 기반으로 다듬으세요.
다음: 페어 컬러 팔레트


