큐레이션 · 오픈 · 무료

Cinderbloc

강력한 기하학적 기반을 둔, 타이포그래피 중심의 단색 아이덴티티.

01

디자인 DNA

디지털 디자인을 위한 대담하고 건축적인 기반.

02

컬러

검정, 흰색, 회색의 엄격한 팔레트를 사용한 극도의 대비.

03

타이포그래피

geometric-sans

• display62px · 300
• body15px · 400

전시용 텍스트는 모두 대문자로 표기합니다. · 크기 큰 전시용 텍스트에는 얇은 굵기(300)를 사용합니다.

04

여백

풍부한 여백, 숨 쉬는 공간을 위한 큰 패딩 값.

05

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

기하학적 도형에 사용되는 얇고 정밀한 선(3px).

06

레이아웃

정밀한 기하학적 정렬이 돋보이는 크고 깔끔한 공간 블록.

07

모션과 인터랙션

커스텀 cubic-bezier easing을 사용한 매끄럽고 세련된 전환 효과. · 요소들이 약간의 변형과 함께 부드럽게 나타남.

불투명도나 약간의 변형을 포함하는 미묘한 상태 변화. · 전환을 통한 즉각적인 시각적 피드백.

08

컴포넌트

• button 기하학적, 고대비, 대문자 텍스트.
• card 얇은 외곽선과 풍부한 패딩으로 정의됩니다.
• chip 고대비를 가진 단순한 기하학적 도형.
• input 깔끔하고 미니멀하며, 정밀한 테두리.
• hero 지배적인 타이포그래피와 크고 기하학적인 배경 도형.

09

보이스와 금지 목록

• 톤 권위적이고 구조적이며 자신감 있는 어조.
• 헤드라인 대담하고 대문자이며, 종종 기하학적으로 배치됨.
• CTA 명확하고 대문자이며 직접적인 표현.

• 여러 폰트 패밀리를 사용하지 마세요 — 스크린샷은 기하학적 sans-serif 단일체를 보여줍니다.
• 밝고 채도 높은 색상을 사용하지 마세요 — 스크린샷은 엄격한 단색 팔레트를 보여줍니다.
• 둥글고 장난스러운 도형을 사용하지 마세요 — 스크린샷은 날카롭고 기하학적인 형태를 보여줍니다.
• 전시용 텍스트에 두꺼운 폰트 굵기를 사용하지 마세요 — 스크린샷은 얇은 굵기(300)를 보여줍니다.
• 헤드라인에 소문자를 사용하지 마세요 — 스크린샷은 대문자 텍스트를 보여줍니다.
• 복잡한 그림자나 그라디언트를 추가하지 마세요 — 스크린샷은 평면적이고 깔끔한 표면을 보여줍니다.
• 피하기: 장난스럽거나 캐주얼한 언어.
• 피하기: 장식적이거나 화려한 요소.
• 피하기: 복잡한 색상 팔레트.

10

팩 안의 실제 스크린샷

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

11

System Prompt

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