큐레이션 · 오픈 · 무료

Flowen Me

크리에이티브 개발자를 위한 고대비, 타이포그래피 중심의 포트폴리오.

01

디자인 DNA

네온 조명으로 밝혀진 브루탈리스트 산업용 대시보드.

02

컬러

어둡고 무채색 배경과 밝은 흰색 타이포그래피 사이의 극도의 대비로 최대의 가독성과 시각적 임팩트를 추구합니다.

03

타이포그래피

geometric-sans · display-serif · monospace

• display100px · 700
• body108px · 700

모든 주요 텍스트는 대문자로 설정됩니다. · 헤드라인에는 거대하고 촘촘한 기하학적 sans-serif가 사용됩니다. · 대체 헤드라인에는 장식적인 display serif가 사용됩니다.

04

여백

거대한 타이포그래피 블록을 분리하기 위해 주요 섹션 사이에 넉넉한 수직 패딩을 둡니다.

05

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

보이는 테두리는 전혀 사용하지 않으며, 오직 타이포그래피 스케일과 공간적 분리에만 의존합니다.

06

레이아웃

텍스트가 흐름을 결정하는 비대칭적, 타이포그래피 중심 레이아웃.

07

모션과 인터랙션

인터랙티브 텍스트 요소에서 커서가 포인터로 변경됩니다. · 표준 링크 내비게이션.

08

컴포넌트

• button 밑줄이나 화살표가 있는 텍스트 기반 링크.
• card 이미지는 타이포그래피 흐름에 직접 통합되므로, 별도의 카드는 없습니다.
• chip 없음.
• input 없음.
• hero 프로젝트 썸네일과 함께 배치된 거대한 타이포그래피 단어 묶음.

09

보이스와 금지 목록

• 톤 직설적이고 자신감 있으며, 약간 반항적인.
• 헤드라인 수직으로 쌓인 짧고 강렬한 대문자 단어.
• CTA 화살표나 밑줄이 있는 직접적인 텍스트 링크.

• 중앙 정렬 레이아웃을 사용하지 마세요 — 스크린샷은 왼쪽 정렬된 비대칭적 텍스트 블록을 보여줍니다.
• 미묘한 색상이나 그라데이션을 사용하지 마세요 — 스크린샷은 날카롭고 고대비의 팔레트를 보여줍니다.
• 작은 또는 표준 텍스트 크기를 사용하지 마세요 — 스크린샷은 거대하고 display 수준의 타이포그래피를 보여줍니다.
• 둥근 모서리를 사용하지 마세요 — 스크린샷은 날카롭고 직사각형의 모서리를 보여줍니다.
• 복잡한 아이콘이나 버튼을 사용하지 마세요 — 스크린샷은 간단하고 텍스트 기반의 내비게이션을 보여줍니다.
• 밝은 테마를 사용하지 마세요 — 스크린샷은 어두운 배경과 밝은 텍스트를 보여줍니다.
• 피하기: 공손함
• 피하기: 복잡한 문장
• 피하기: 둥근 모서리
• 피하기: 그라데이션 배경

10

팩 안의 실제 스크린샷

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

11

System Prompt

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