모던 울트라마린 톤: 시도해볼 20가지 팔레트 조합

울트라마린(#120A8F)은 인터페이스, 포스터 및 브랜드 시스템에 즉각적으로 구조를 더하는 깊고 자신감 있는 블루입니다. 디지털과 인쇄 매체 모두에서 다재다능하게 유지하면서 프리미엄하고 현대적으로 보입니다.

아래는 HEX 코드, 무드 노트 및 실용적인 페어링 팁이 포함된 엄선된 울트라마린 컬러 팔레트 믹스입니다. 메시지와 레이아웃 제약에 맞는 스킴을 선택할 수 있습니다.

울트라마린 팔레트가 잘 작동하는 이유

울트라마린은 자연스러운 권위를 가지고 있습니다. 레이아웃을 안정시킬 만큼 충분히 어둡지만 의도적이고 활기차게 느껴질 만큼 충분히 채도가 높습니다. 이러한 균형은 계층 구조가 필요한 시스템에 신뢰할 수 있는 "앵커 컬러"가 됩니다.

UI에서 울트라마린은 무거운 테두리에 의존하지 않고도 내비게이션, 활성 상태 및 히어로 요소를 분리하는 데 도움이 됩니다. 브랜딩에서는 앰버, 테라코타 또는 골드와 같은 따뜻한 강조색을 위한 공간을 남기면서도 자신감과 신뢰를 나타냅니다.

쿨 톤(시안, 시폼, 페리윙클)과 웜 보색(오렌지, 핑크, 베이지) 모두와 잘 어울리기 때문에 울트라마린 컬러 스킴은 일관성을 잃지 않으면서도 미니멀 럭셔리부터 대담한 캠페인까지 분위기를 전환할 수 있습니다.

20가지 이상의 울트라마린 컬러 팔레트 아이디어 (HEX 코드 포함)

1) 미드나잇 세일

HEX: #120A8F #0B1D39 #2E5AAC #F4F1E8 #C9B18C

무드: 해양적, 자신감 있는, 세련된

최적: 브랜드 아이덴티티 및 히어로 섹션

해양적이고 자신감 있으며 깨끗한 스포트라이트 아래 밤 바다처럼 느껴집니다. 이 울트라마린 컬러 팔레트는 프리미엄 브랜딩, 랜딩 페이지 및 대담한 내비게이션 바에 아름답게 작동합니다. 깊은 블루를 따뜻한 샌드와 크리미한 화이트와 페어링하여 대비를 읽기 쉽고 우아하게 유지하세요. 사용 팁: 골드-베이지는 아이콘, 배지 및 주요 CTA와 같은 작은 하이라이트용으로 예약하세요.

media.io를 사용하여 생성된 미드나잇 세일의 이미지 예시

Media.io

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

지금 무료로 사용해보기

2) 모던 델프트

HEX: #1E3A8A #3B82F6 #93C5FD #F8FAFC #F59E0B

무드: 신선한, 밝은, 친근한

최적: 앱 UI 및 대시보드

신선하고 경쾌하며 유약을 바른 세라믹 타일과 맑은 햇빛을 연상시킵니다. 레이어드 블루는 UI 상태에 자연스러운 계층 구조를 제공하고 따뜻한 앰버는 즉각적인 집중을 더합니다. 가장 밝은 블루와 오프화이트를 표면으로 사용한 다음 헤더와 활성 탭에 깊은 울트라마린을 적용하세요. 팁: 시각적 노이즈를 피하기 위해 화면당 하나의 주요 액션에 오렌지를 사용하세요.

media.io를 사용하여 생성된 모던 델프트의 이미지 예시

3) 벨벳 오페라

HEX: #1A0B6E #7C3AED #F472B6 #111827 #F9FAFB

무드: 드라마틱한, 럭셔리한, 예술적인

최적: 이벤트 포스터 및 앨범 아트

드라마틱하고 럭셔리하며 벨벳 커튼과 무대 조명처럼 느껴집니다. 깊은 인디고와 차콜이 무디한 베이스를 만들고 바이올렛과 핑크는 헤드라인에 강렬한 에너지를 가져옵니다. 밝은 강조색이 압도하지 않도록 타이틀 주변의 네거티브 스페이스에 연한 화이트를 사용하세요. 팁: 날짜, 아이콘 또는 단일 그라데이션 스트로크와 같은 주요 초점 요소에만 핑크를 적용하세요.

media.io를 사용하여 생성된 벨벳 오페라의 이미지 예시

4) 코스탈 잉크

HEX: #162B75 #0EA5E9 #14B8A6 #E2E8F0 #0F172A

무드: 선명한, 현대적인, 해안의

최적: SaaS 웹사이트 및 인포그래픽

선명하고 해안적이며 잉크 라인, 시글라스 및 깨끗한 공기를 연상시킵니다. 밝은 시안과 틸이 어두운 블루가 무겁게 느껴지는 것을 방지하여 SaaS 페이지와 데이터 비주얼에 적합합니다. 보조 패널에 틸과 함께 라이트 그레이를 페어링하고 텍스트용으로 거의 검은색을 예약하세요. 팁: 호버 및 선택된 표시기와 같은 인터랙티브 상태에 시안을 아껴서 사용하세요.

media.io를 사용하여 생성된 코스탈 잉크의 이미지 예시

5) 갤러리 스포트라이트

HEX: #1D2D8C #E5E7EB #FFFFFF #D4AF37 #111111

무드: 미니멀한, 프리미엄, 고대비

최적: 럭셔리 제품 광고

미니멀하고 프리미엄하며 단일 스포트라이트가 있는 조용한 갤러리처럼 느껴집니다. 울트라마린과 블랙이 권위를 전달하고 화이트와 소프트 그레이가 모든 것을 선명하고 에디토리얼하게 유지합니다. 로고 마크나 가격 세부 정보와 같이 시선이 닿기를 원하는 곳에만 골드를 추가하세요. 팁: 깊은 블루가 무겁지 않고 의도적으로 읽히도록 배경을 깨끗하게 유지하세요.

media.io를 사용하여 생성된 갤러리 스포트라이트의 이미지 예시

6) 아스트랄 시트러스

HEX: #1B2A9B #F97316 #FDE68A #0F172A #F8FAFC

무드: 대담한, 활기찬, 미래적인

최적: 캠페인 배너 및 CTA

대담하고 활기차며 밝은 시트러스 빛으로 자른 밤하늘을 연상시킵니다. 이러한 울트라마린 컬러 조합은 즉각적인 대비와 명확한 콜투액션이 필요한 캠페인 배너에 이상적입니다. 깊은 블루와 차콜이 배경을 담당하게 한 다음 버튼과 하이라이트에 오렌지를 팝하세요. 팁: 연한 노란색은 본문 텍스트가 아닌 헤드라인 뒤의 부드러운 글로우로 사용하세요.

media.io를 사용하여 생성된 아스트랄 시트러스의 이미지 예시

7) 보타니컬 미드나잇

HEX: #15206B #0F766E #84CC16 #F3F4F6 #334155

무드: 자연적인, 차분한, 야행성의

최적: 식물 일러스트 및 라벨

자연적이고 차분하며 깊은 블루 하늘 아래 비 온 후의 정원처럼 느껴집니다. 그린은 밤 톤 베이스에 대해 자연스럽고 현대적으로 읽혀 식물 브랜드나 에코 메시징에 적합합니다. 라벨 공간에 오프화이트를 사용하고 타이포그래피와 라인워크에 슬레이트를 유지하세요. 팁: 히어로 잎이나 단일 강조 스탬프에만 밝은 리프 그린을 추가하세요.

media.io를 사용하여 생성된 보타니컬 미드나잇의 이미지 예시

8) 페이퍼 피그먼트

HEX: #2431A5 #E11D48 #F1F5F9 #A3A3A3 #0B0F1A

무드: 에디토리얼, 강렬한, 현대적인

최적: 매거진 표지 및 소셜 포스트

에디토리얼하고 강렬하며 선명한 종이에 신선한 잉크처럼 보입니다. 핫 레드는 즉각적인 강조를 만들고 울트라마린은 레이아웃을 안정적이고 현대적으로 유지합니다. 라이트 그레이를 넉넉한 여백으로 사용하고 읽기 쉬운 캡션용으로 거의 검은색에 의존하세요. 팁: 깔끔한 계층 구조를 위해 태그 라벨이나 단일 밑줄과 같이 하나 또는 두 개의 요소에 레드를 유지하세요.

media.io를 사용하여 생성된 페이퍼 피그먼트의 이미지 예시

9) 레트로 아케이드

HEX: #2B18FF #FF2D95 #00D1FF #0B1021 #F8FAFC

무드: 유쾌한, 네온, 고에너지

최적: 스트림 오버레이 및 프로모

유쾌하고 네온 같으며 어두운 방에 아케이드 조명처럼 느껴집니다. 일렉트릭 블루와 시안은 테크 포워드 분위기를 만들고 핫 핑크는 재미있고 젊은 펀치를 더합니다. 밝은 색상이 통제되도록 메인 캔버스에 거의 검은색을 사용하세요. 팁: 읽기 쉽게 유지하기 위해 네온 톤을 전체 블록이 아닌 스트로크와 글로우 하이라이트로 적용하세요.

media.io를 사용하여 생성된 레트로 아케이드의 이미지 예시

10) 조용한 도서관

HEX: #1F2A7A #6B7280 #D1D5DB #F5F3E7 #8B5E34

무드: 차분한, 학구적인, 시대를 초월한

최적: 출판 사이트 및 포트폴리오

차분하고 학구적이며, 천으로 제본된 책과 부드러운 독서등을 떠올리게 합니다. 깊은 파란색이 디자인을 고정하고, 따뜻한 크림색과 갈색이 조용하고 인간적인 느낌을 더합니다. 회색은 보조 UI와 최소한의 방해가 필요한 긴 형식의 레이아웃에 사용하세요. 팁: 갈색은 작은 구분선이나 아이콘에만 사용하여 경쟁하는 헤드라인 색상이 아닌 미묘한 광택처럼 유지하세요.

media.io를 사용하여 생성된 조용한 도서관의 이미지 예시

11) 세라믹 블룸

HEX: #253494 #F43F5E #FB7185 #FFF7ED #22C55E

무드: 경쾌한, 꽃 같은, 창의적인

최적: 초대장 및 문구류

경쾌하고 꽃 같으며, 칠해진 도자기와 봄 꽃다발 같은 느낌입니다. 풍부한 파란색이 구성을 안정적으로 유지하고 장밋빛 톤이 따뜻함과 축하 분위기를 더합니다. 크림 배경을 사용하여 글자를 읽기 쉽게 유지하고 녹색을 작은 식물 액센트로 활용하세요. 팁: 분홍색을 이름 뒤의 리본 모양으로 사용하고, 울트라마린을 텍스트와 테두리에 사용해 보세요.

media.io를 사용하여 생성된 세라믹 블룸의 이미지 예시

12) 야시장

HEX: #0F1A5A #F59E0B #DC2626 #F1F5F9 #111827

무드: 생동감 있는, 도시적인, 식욕을 돋우는

최적: 음식 전단지 및 레스토랑 프로모션

생동감 있고 도시적이며, 등불, 간판, 심야 포장마차를 떠올리게 합니다. 따뜻한 호박색과 빨간색이 짙은 파란색 배경에 눈부시게 튀어나와 음식 프로모션과 대담한 헤드라인에 완벽합니다. 오프화이트는 메뉴 텍스트 블록에 사용하고 거의 검은색은 작은 글씨에 사용하세요. 팁: 호박색을 주요 강조 색상으로 설정하고 빨간색은 특가나 기간 한정 태그에만 사용하세요.

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

13) 산 그림자

HEX: #1C2C6B #64748B #94A3B8 #E2E8F0 #16A34A

무드: 야외 활동적인, 안정적인, 시원한

최적: 여행 블로그 및 지도 UI

야외 활동적이고 안정적이며, 소나무 향이 살짝 나는 산 그늘처럼 느껴집니다. 슬레이트 블루는 지도, 내비게이션 및 콘텐츠가 많은 페이지에 신뢰할 수 있는 구조를 만듭니다. 연한 회색-파란색을 캔버스로 사용하고 녹색은 위치 핀이나 상태 표시에 사용하세요. 팁: 접근성을 위해 흰색 텍스트는 가장 어두운 파란색에만 배치하고 녹색은 긴 단락에 사용하지 마세요.

media.io를 사용하여 생성된 산 그림자의 이미지 예시

14) 럭스 미니멀

HEX: #1A237E #F5F5F4 #D6D3D1 #0A0A0A #C4A484

무드: 고급스러운, 조용한, 건축적인

최적: 포장 및 프리미엄 브랜딩

고급스럽고 조용하며, 대리석, 잉크, 따뜻한 황동 디테일을 연상시킵니다. 이 울트라마린 컬러 팔레트는 대비와 절제가 중요한 프리미엄 포장에서 빛을 발합니다. 깊은 파란색을 부드러운 석재 중성색과 짝을 이루고, 황갈색을 봉인, 테두리 또는 작은 아이콘의 금속 같은 액센트로 사용하세요. 팁: 울트라마린을 큰 영역으로 인쇄하고 액센트는 고급스러운 마무리를 위해 얇은 선으로만 유지하세요.

media.io를 사용하여 생성된 럭스 미니멀의 이미지 예시

15) 프리즘 그라디언트

HEX: #0B0F6A #2563EB #38BDF8 #A78BFA #F8FAFC

무드: 깔끔한, 디지털, 낙관적인

최적: 기술 랜딩 페이지 및 그라디언트

깔끔하고 낙관적이며, 유리를 통해 굴절되는 빛처럼 보입니다. 단계적 블루와 부드러운 바이올렛은 현대적인 그라디언트, 차트 및 히어로 일러스트레이션에 완벽합니다. 오프화이트를 여백으로 사용한 다음 중간 파란색을 시안에 섞어 거친 가장자리 없이 깊이를 만드세요. 팁: 바이올렛을 보조 그라디언트 정지점으로 적용하여 방해 요소가 아닌 프리미엄 디테일로 읽히도록 하세요.

media.io를 사용하여 생성된 프리즘 그라디언트의 이미지 예시

16) 솔라 포스터

HEX: #1E2A9E #FACC15 #F43F5E #0F172A #FAFAF9

무드: 대담한, 화창한, 그래픽적인

최적: 페스티벌 포스터 및 공지

대담하고 화창하며, 팝아트 태양이 있는 울트라마린 하늘처럼 느껴집니다. 이러한 울트라마린 색상 조합은 방 건너편에서도 임팩트가 필요한 포스터를 위해 만들어졌습니다. 깊은 톤은 큰 모양에 사용하고 노란색은 제목이나 날짜와 같은 스포트라이트 요소에 사용하며, 분홍색은 보조 펀치로 사용하세요. 팁: 오프화이트는 작은 텍스트 블록에 사용하여 가장 밝은 색상이 강조용으로 예약되도록 하세요.

media.io를 사용하여 생성된 솔라 포스터의 이미지 예시

17) 슬레이트 시폼

HEX: #18206F #5EEAD4 #0F766E #CBD5E1 #1F2937

무드: 시원한, 균형 잡힌, 상쾌한

최적: 웰니스 브랜드 및 웹 섹션

시원하고 균형 잡혀 있으며, 어두운 바위에 부딪히는 거품을 떠올리게 합니다. 민트 틸이 깊은 파란색을 부드럽게 하여 웰니스 및 라이프스타일 페이지에 차분하고 신뢰할 수 있는 느낌을 만듭니다. 연한 슬레이트를 주요 배경으로 사용하고 가장 어두운 톤은 제목에 사용하세요. 팁: 민트를 호버 및 활성 상태로 설정하여 소리치지 않고 미묘한 움직임을 추가하세요.

media.io를 사용하여 생성된 슬레이트 시폼의 이미지 예시

18) 에디토리얼 네이비

HEX: #151B54 #E5E7EB #9CA3AF #B91C1C #FFFFFF

무드: 진지한, 뉴스 같은, 권위 있는

최적: 보고서 및 편집 레이아웃

진지하고 권위 있으며, 웹을 위해 재구성된 신문처럼 느껴집니다. 네이비와 회색은 밀도 높은 콘텐츠를 지원하고, 깊은 빨간색은 링크나 콜아웃을 위한 클래식한 편집 액센트를 추가합니다. 흰색은 넉넉한 여백에 사용하고 회색은 구분선과 캡션을 처리하도록 하세요. 팁: 빨간색은 경고나 섹션 태그와 같은 단일 시스템 역할로만 유지하여 일관된 스캔을 위해 사용하세요.

media.io를 사용하여 생성된 에디토리얼 네이비의 이미지 예시

19) 오키드 나이트

HEX: #1B0F8A #C026D3 #F0ABFC #0B1320 #F5F3FF

무드: 신비로운, 몽환적인, 화려한

최적: 뷰티 브랜딩 및 소셜 광고

신비롭고 몽환적이며, 어두운 방에서 빛나는 난초를 연상시킵니다. 보라-분홍 범위는 화려하게 느껴지고, 깊은 파란색은 현대적이고 안정적으로 유지합니다. 연한 라벤더를 부드러운 배경으로 사용하고 마젠타를 제품 이름이나 스티커와 같은 하이라이트에 사용하세요. 팁: 울트라마린과 바이올렛 사이에 미묘한 그라디언트를 추가하여 추가 색상 없이 깊이를 만드세요.

media.io를 사용하여 생성된 오키드 나이트의 이미지 예시

20) 웜 테라코타

HEX: #1D2A8F #C2410C #FB923C #FDEBD0 #374151

무드: 따뜻한, 안정적인, 수제의

최적: 홈 데코 브랜드 및 룩북

따뜻하고 안정적이며, 점토, 리넨, 깊은 파란색 유약처럼 느껴집니다. 테라코타 톤은 파란색을 더 풍부하고 친근하게 보이게 하여 홈 데코 및 수제 제품에 이상적입니다. 크림을 주요 페이지 배경으로 사용하고 차콜은 텍스트와 윤곽선에 사용하세요. 팁: 오렌지를 버튼과 태그 같은 작은 디테일에 주도하게 하고, 파란색은 헤더와 프레임을 고정하도록 하세요.

media.io를 사용하여 생성된 웜 테라코타의 이미지 예시

울트라마린과 잘 어울리는 색상은?

울트라마린은 따뜻한 보색—오렌지, 호박색, 테라코타, 골드—과 아름답게 조화를 이루며, 즉각적인 대비를 만들어 CTA, 가격 또는 주요 라벨로 주의를 유도합니다.

더 차분하고 현대적인 믹스를 위해 울트라마린을 시안, 틸, 시폼 또는 부드러운 바이올렛과 같은 차가운 액센트와 매치하세요. 이렇게 하면 기본 파란색의 깊이를 유지하면서 팔레트를 "디지털"하고 통풍이 잘 되게 유지합니다.

미니멀하고 프리미엄하게 유지하려면 울트라마린을 흰색, 오프화이트, 라이트 그레이, 거의 검은색과 결합하세요. 세련된 마무리를 위해 금속 같은 액센트(황갈색/골드) 하나를 소량 추가하세요.

실제 디자인에서 울트라마린 컬러 팔레트를 사용하는 방법

울트라마린을 구조적 색상으로 사용하세요: 헤더, 내비게이션, 섹션 구분선, 히어로 패널. 그런 다음 가장 밝은 액센트(오렌지/분홍/노랑)를 액션과 하이라이트에 배치하여 사용자의 주의가 단일하고 명확한 경로를 갖도록 하세요.

가독성을 위해 본문 텍스트는 밝은 중성색에 유지하고 흰색-온-울트라마린은 짧은 요소(버튼, 내비게이션 라벨, 배지)용으로 예약하세요. 차트를 디자인하는 경우 울트라마린을 "주요 시리즈"에 할당하고 보조 시리즈에는 더 밝은 틴트를 사용하세요.

인쇄물(포스터, 포장, 문구류)에서 울트라마린은 절제된 액센트 라인이 있는 큰 영역에서 가장 잘 작동합니다. 이렇게 하면 파란색이 시각적으로 무겁기보다는 의도적이고 프리미엄하게 느껴집니다.

AI로 울트라마린 팔레트 비주얼 만들기

이미 HEX 코드가 있는 경우 구성(레이아웃, 타이포그래피, 모양)을 설명하고 팔레트 색상을 지정하여 배너 아이디어, 포스터 레이아웃 및 UI 목업으로 빠르게 전환할 수 있습니다.

일관된 결과를 위해 어떤 색상이 주요한지, 어떤 색상이 배경 중성색인지, 어떤 색상이 "작은 하이라이트"로 제한되어야 하는지 언급하세요. 종횡비(예: 16:9 또는 3:4)를 추가하면 이미지가 사용 사례와 일치하는 데 도움이 됩니다.

Media.io의 텍스트-투-이미지를 사용하면 처음부터 다시 구축하지 않고도 소셜, 광고, 히어로 섹션 등 여러 형식에 걸쳐 동일한 울트라마린 색상 구성표를 반복할 수 있습니다.

다음: 비터스위트 컬러 팔레트