큐레이션 · 오픈 · 무료

Ethereum

이더리움 생태계를 위한 차분한 교육 허브.

01

디자인 DNA

탈중앙화 네트워크를 위한 깔끔하고 설명적인 공용 포털.

02

컬러

보라색 강조와 부드러운 흑백 계층을 사용한 흰색 주도 레이아웃.

03

타이포그래피

humanist-sans · mono

• display56px · 900

04

여백

1.6 배율

05

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

1px solid rgba(207, 207, 207, 1)

0 1px 1px 0 rgba(0, 0, 0, 0.1)

06

레이아웃

전체 폭의 히어로 이미지, 그 아래 중앙 정렬된 텍스트 콘텐츠.

07

모션과 인터랙션

hover 시 색상 전환 · 상호작용 요소의 transform/scale

상호작용 요소의 색상 전환. · transform을 통한 시각적 피드백.

08

컴포넌트

• button 흰색 텍스트가 있는 보라색 알약 형태 버튼.
• card 둥근 모서리와 부드러운 그림자가 있는 가벼운 테두리 카드.
• chip 알약 형태 탭 선택기.
• input 아이콘과 단축키가 있는 검색 바.
• hero 중앙 정렬된 굵은 헤드라인이 있는 전체 폭 일러스트레이션.

09

보이스와 금지 목록

• 톤 교육적이며, 접근 가능하고, 권위 있는.
• 헤드라인 굵고, 선언적이며, 사용자 중심적.
• CTA 직설적이며 격려하는, 예: '여기서 시작하기'.

• 다크 모드 사용 금지 — 스크린샷은 주로 흰색 배경을 보여줍니다.
• 고대비 네온색 사용 금지 — 스크린샷은 부드러운 보라색 강조(#6C24E0)를 보여줍니다.
• 헤드라인에 세리프 폰트 사용 금지 — 스크린샷은 굵은 humanist-sans 폰트를 보여줍니다.
• 무거운 드롭 그림자 사용 금지 — 스크린샷은 미니멀하고 부드러운 그림자를 보여줍니다.
• 좁고 밀집된 레이아웃 사용 금지 — 스크린샷은 넉넉한 여백과 깔끔한 리듬을 보여줍니다.
• 장식적인 테두리 사용 금지 — 스크린샷은 섬세한 1px 테두리를 사용합니다.
• 피하기: 기술 전문 용어
• 피하기: 복잡성
• 피하기: 다크 테마
• 피하기: 공격적인 마케팅

10

팩 안의 실제 스크린샷

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

11

System Prompt

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