큐레이션 · 오픈 · 무료

Jeen Yuhs

브루탈리즘, 글리치 미학과 레트로 디지털 타이포그래피를 적용한 엄격한 단색 아카이브 포털입니다.

01

디자인 DNA

글리치된 VHS 테이프 또는 브루탈리즘 디지털 전시 입구

02

컬러

절대적인 이진 대비; 순수한 흑백만 사용합니다.

03

타이포그래피

monospace

• display200px · 400
• body18px · 400
• caption12px · 400

모든 텍스트는 엄격히 대문자로 표시합니다 · 모든 요소에 모노스페이스 글꼴 계열을 사용합니다

04

여백

표준 4px 베이스에 상호작용 요소에는 넉넉한 padding을 적용합니다.

05

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

상호작용 요소에 엄격한 2px solid 테두리, border-radius 없음.

06

레이아웃

콘텐츠를 중앙에 배치한 풀스크린 검은 캔버스로, 엄격한 흰색 요소를 강조합니다.

07

모션과 인터랙션

글리치-깜빡임 · 색상-변이 · 디지털-아티팩팅

색상을 반전시키거나 디지털 글리치 효과를 트리거합니다. · 마이크로 상호작용 또는 글리치 트랜지션을 트리거합니다.

08

컴포넌트

• button 2px solid 흰색 테두리와 2px padding이 적용된 대문자 모노스페이스 텍스트.
• card 엄격한 테두리와 둥근 모서리 없는 미니멀리스트 콘텐츠 블록.
• chip 2px solid 테두리가 적용된 소형 대문자 모노스페이스 태그.
• input 2px solid 흰색 테두리와 검은 배경의 미니멀리스트 텍스트 입력.
• hero 검은 배경 위에 중앙에 배치된 거대한 글리치된 모노스페이스 문자(예: 'II').

09

보이스와 금지 목록

• 톤 원시적, 아카이브적, 실험적, 타협하지 않는
• 헤드라인 엄격하며 모노스페이스이고, 종종 글리치되거나 왜곡됩니다.
• CTA 대문자 모노스페이스 텍스트, 종종 2px 테두리 포함.

• 부드러운 그림자를 사용하지 마세요 — 스크린샷은 평면적이고 테두리 없는 요소만 보여줍니다.
• 둥근 모서리를 사용하지 마세요 — 스크린샷은 엄격한 직사각형 형태만 보여줍니다.
• 여러 색상을 사용하지 마세요 — 스크린샷은 엄격한 흑백 팔레트를 보여줍니다.
• 산세리프 글꼴을 사용하지 마세요 — 스크린샷은 독점적으로 모노스페이스 타이포그래피를 보여줍니다.
• 소문자 텍스트를 사용하지 마세요 — 스크린샷은 모든 텍스트가 대문자로 표시됩니다.
• 복잡한 그라디언트를 사용하지 마세요 — 스크린샷은 순수한 흑백 채우기를 보여줍니다.
• 피하기: 매끄러운 그라디언트
• 피하기: 둥근 모서리
• 피하기: 따뜻한 톤
• 피하기: 친근한 일러스트레이션

10

팩 안의 실제 스크린샷

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

11

System Prompt

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