큐레이션 · 오픈 · 무료

Flos

미니멀하고 에디토리얼한 미학을 가진 프리미엄 이탈리안 조명 브랜드.

01

디자인 DNA

하이엔드 조명 디자인을 위한 갤러리 카탈로그.

02

컬러

고대비 사진이 지배적이며, 텍스트 색상은 라이트/다크 컨텍스트에 따라 반전됩니다.

03

타이포그래피

humanist-sans

• display64px · 800
• heading40px · 600
• body16px · 400

04

여백

여유로운 여백과 제목에 대한 타이트한 자간을 사용합니다.

05

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

컨텍스트에 따라 1px solid #000000 또는 #FFFFFF.

rgba(0, 0, 0, 0.15) 0px 4px 16px 0px

06

레이아웃

오버레이 텍스트가 있는 풀블리드 히어로 이미지; 그리드 기반 제품 카드.

07

모션과 인터랙션

부드러운 페이드인 전환 · hover 시 스케일 변환

미묘한 opacity 또는 배경색 변화. · 기본 포인터 커서.

08

컴포넌트

• button 1px solid border와 전부 대문자 텍스트를 가진 고스트 버튼.
• card 보이는 border나 shadow가 없는 이미지 중심 카드.
• hero 왼쪽 정렬된 흰색 텍스트가 있는 전면 사진 배경.

09

보이스와 금지 목록

• 톤 세련되고, 건축적이며, 절제된.
• 헤드라인 볼드, 전부 대문자 또는 타이틀 케이스, 최소한의 구두점.
• CTA 전부 대문자, 고스트 버튼 스타일.

• 밝고 채도 높은 색상을 사용하지 마세요 — 스크린샷은 검정, 흰색, 무채색 회색이 지배적인 팔레트를 보여줍니다.
• 기본 요소에 둥근 모서리를 사용하지 마세요 — 스크린샷은 날카로운 모서리 또는 매우 미묘한 radius를 보여줍니다.
• 카드에 무거운 drop shadow를 추가하지 마세요 — 스크린샷은 플랫하고 이미지 기반 레이아웃을 보여줍니다.
• 장식용 또는 스크립트 폰트를 사용하지 마세요 — 스크린샷은 모든 텍스트에 깔끔한 humanist sans-serif를 사용합니다.
• 히어로 섹션에 여러 CTA를 복잡하게 배치하지 마세요 — 스크린샷은 단일하고 명확한 'DISCOVER MORE' 버튼을 보여줍니다.
• 텍스트 뒤에 지저분한 배경을 사용하지 마세요 — 스크린샷은 다크 오버레이나 단색 배경을 통해 가독성을 보장합니다.
• 피하기: 밝은 색상
• 피하기: 장난스러운 폰트
• 피하기: 과도한 UI 크롬
• 피하기: 무거운 그림자

10

팩 안의 실제 스크린샷

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

11

System Prompt

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