styles
← 갤러리

Velvet Dark Boutique

와인기 도는 딥 차콜 벨벳 바탕에 골드-브론즈 헤어라인으로 두른 모듈러 벤토 룩북 — 발광 없는 다크 럭셔리 부티크.

luxury-editorial dark-luxuryvelvetbento-gridgold-bronzeserif-displayboutique
⬇ AI 번들 (llms.md) DESIGN.md tokens.json
라이브 프리뷰 — 동일 샘플 UI에 이 스타일 적용

설명

순흑이 아닌 와인빛 짙은 차콜을 바탕으로 삼고, 크기가 제각각인 타일을 벤토 모자이크로 짜서 룩북·제품을 배열한다. 각 타일은 비발광 골드-브론즈 헤어라인으로 둘러지고 표면에 절차적 벨벳 매트 그레인이 미세하게 깔린다. 헤딩은 세리프(Cormorant), 인용은 세리프 이탤릭(Spectral), 메타·라벨은 작은 대문자 산세리프(Inter). 강조는 따뜻한 골드 하나뿐이며 면적 6% 이하로 선·텍스트·작은 라벨에만 쓴다. 네온·글로우 없이 명도 차와 헤어라인으로 깊이를 만든다.

타입 스케일

display Ag 스타일 견본 Style Specimen
h2 Ag 스타일 견본 Style Specimen
h3 Ag 스타일 견본 Style Specimen
quote Ag 스타일 견본 Style Specimen
body Ag 스타일 견본 Style Specimen
label Ag 스타일 견본 Style Specimen
price Ag 스타일 견본 Style Specimen

세리프+산세리프 믹스. 헤딩·디스플레이는 Cormorant 세리프(500~600), 인용·룩북 카피는 Spectral 이탤릭 400, 키커/라벨/본문/가격은 Inter. 라벨은 대문자 + 넓은 자간(0.18em)으로 골드 키커 역할. 측정 56~66자.

골든 예제 (exemplar)

The Autumn Edit

Quiet luxury, framed in velvet.

A boutique lookbook where each piece floats in wine-dark light, edged in the thinnest line of gold.

View collection

Look 01

The Velvet Coat

€1,480

Silk & Bronze

Accessory

Gilded Clasp

€320

"Warmth, held in shadow."

Do

  • 배경은 순흑이 아니라 와인기 도는 짙은 차콜
  • 타일은 크기 위계를 준 벤토 모자이크로 짠다(2×2·4×2·6×3 등)
  • 강조는 따뜻한 골드 하나만 — 선·텍스트·작은 라벨에, 면적 6% 이하
  • 헤어라인은 선명한 비발광 1px 골드-브론즈 선
  • 표면에 절차적 벨벳 그레인을 코드로 생성해 미세하게 깐다
  • 깊이는 표면 명도 차와 헤어라인으로 — 그림자는 최소

Don't

  • 순흑(#000000) 배경 금지
  • 발광·네온·글로우 보더 금지 — 헤어라인은 비발광
  • 골드 외 강조색 금지, 골드를 타일 배경 면으로 칠하기 금지
  • 균등 크기 타일 그리드 금지 — 벤토의 크기 위계가 정체성
  • 보라·다색 그라디언트 금지(골드-브론즈 헤어라인 예외)
  • 큰 radius(>14px)·완전 각진 타일 금지
  • 스냅·바운스·발광 펄스 모션 금지
  • 이모지·일러스트·blob·그라디언트 텍스트 금지
  • 스톡 텍스처 이미지 파일 의존 금지 — 벨벳 그레인은 SVG/CSS 생성

컴포넌트 노트

button
base: 고스트 — 1px solid accent(골드), 골드 텍스트, 배경 투명, radius 8px, padding 12px 26px, 대문자 label 타이포 letter-spacing 0.14em
hover: 골드 솔리드 채움 + background 색 텍스트로 반전, 300ms
focus: 2px offset outline (ring)
disabled: opacity 0.4
card
타일 = card 표면, 1px 골드-브론즈 헤어라인 보더, radius 10px, 벨벳 그레인 오버레이(feTurbulence baseFrequency 1.2 monochrome 또는 도트 노이즈, opacity 0.04, mix-blend-mode overlay). 아주 약한 0 12px 32px rgba(0,0,0,0.4) 그림자. 호버 translateY(-4px) + 헤어라인 밝아짐 + 내부 이미지 1.05 줌(overflow hidden).
input
1px border, radius 8px, 다크 표면 위. 포커스 시 border가 골드(ring)로.
nav
상단 골드-브론즈 1px 헤어라인 하단 룰. 좌측 Cormorant 세리프 사이트명, 우측 Inter 대문자 메뉴. 골드 소셜 링크.
image
radius 10px, 채도 -10%, brightness 0.95, 위에 벨벳 그레인 오버레이 살짝.