큐레이션 · 오픈 · 무료

Stykka

대형 사진 히어로 섹션과 깔끔한 세리프 중심 타이포그래피가 특징인, 맞춤형 주방과 인테리어를 디자인하는 프리미엄 플랫폼입니다.

01

디자인 DNA

고급 건축 매거진

02

컬러

고품질 사진에 색상을 의존하는 미니멀리스트 팔레트로, UI 요소는 엄격히 블랙앤화이트입니다.

03

타이포그래피

geometric-sans · humanist-sans · monospace

• display46px · 500
• body16px · 400

04

여백

이미지 주변의 padding과 gap을 일관되게 적용합니다.

05

표면 (라운드 / 그림자 / 경계선)

06

레이아웃

넉넉한 화이트스페이스 마진과 함께하는 엣지투엣지 사진입니다.

07

모션과 인터랙션

Scroll 시 페이드인

링크와 버튼에 미묘한 opacity 변화. · 즉각적인 상태 변화 또는 내비게이션.

08

컴포넌트

• button 미묘한 border와 텍스트만 있는 라벨이 있는 투명 배경입니다.
• card 텍스트가 포함된 단색 배경의 대형 사진 카드입니다.
• chip 작은 플러스 또는 불릿 아이콘이 있는 텍스트 라벨입니다.
• input 하단 border만 있는 텍스트 입력 필드입니다.
• hero 크고 왼쪽 정렬된 타이포그래피가 있는 풀스크린 사진 배경입니다.

09

보이스와 금지 목록

• 톤 전문적이고 이상적이며 차분한 어조.
• 헤드라인 직접적이고 묘사적인, 큰 기하학적 산세리프 사용.
• CTA 'Start building'과 같이 단순하고 행동 지향적인 텍스트.

• 채도 높은 악센트 컬러를 사용하지 마세요 — 스크린샷은 사진에 양보하는 단색 UI를 보여줍니다.
• UI 요소에 드롭 섀도우를 사용하지 마세요 — 스크린샷은 완전히 평면적인 디자인을 보여줍니다.
• 본문 텍스트를 중앙 정렬하지 마세요 — 스크린샷은 엄격한 왼쪽 정렬을 보여줍니다.
• 헤드라인에 장식용 스크립트를 사용하지 마세요 — 스크린샷은 깔끔한 기하학적 산세리프를 보여줍니다.
• 작고 밀집된 텍스트 블록을 사용하지 마세요 — 스크린샷은 넉넉한 화이트스페이스와 큰 타이포를 보여줍니다.
• 복잡한 아이코노그래피를 사용하지 마세요 — 스크린샷은 단순하고 텍스트 기반의 내비게이션을 보여줍니다.
• 피하기: 화려한 애니메이션
• 피하기: 혼잡한 레이아웃
• 피하기: 채도 높은 UI 컬러

10

팩 안의 실제 스크린샷

실제 페이지에서 캡처 · 실 computed styles

11

System Prompt

en · zh-CN · zh-TW · ja · ko