큐레이션 · 오픈 · 무료

Bolt

사용자가 자연어를 통해 앱과 웹사이트를 만들 수 있는 현대적인 다크 테마 AI 플랫폼입니다.

01

디자인 DNA

개발자를 위한 AI 기반 창작 스튜디오.

02

컬러

단 하나의 강렬한 블루 악센트를 사용하는 고대비 다크 모드.

03

타이포그래피

humanist-sans · monospace

• display56px · 700
• heading48px · 600
• body16px · 400
• small14px · 400

04

여백

4px 증분을 일관되게 사용하며, 16px와 24px를 주요 gutter로 사용합니다.

05

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

1px solid rgba(255, 255, 255, 0.1)

0px 1px 2px 0px rgba(0, 0, 0, 0.05) · 0px -15px 24.8px 0px rgba(17, 114, 226, 0.6)

06

레이아웃

고정 최대 너비로 중앙 정렬된 콘텐츠.

07

모션과 인터랙션

상호작용 요소에서의 색상 전환 · hover 및 focus 시 페이드 인/아웃

미세한 색상 변화 또는 투명도 변화. · 즉각적인 시각적 반응.

08

컴포넌트

• button 단색 블루 주요 액션, 둥근 필 또는 작은 반경의 고스트 보조 액션.
• card 미세한 border와 부드러운 그림자가 적용된 어두운 표면.
• chip 태그와 도구를 위한 외곽선 또는 최소한의 배경.
• input 부드러운 border와 미세한 내부 그림자가 적용된 어두운 텍스트 영역.
• hero 발광하는 블루 곡선 그래디언트 배경을 배경으로 한 큰 중앙 정렬 타이포그래피.

09

보이스와 금지 목록

• 톤 직설적이고, 강력하며, 현대적인.
• 헤드라인 질문 지향적이고 행동을 유도하는.
• CTA 명확하고 명령형.

• 밝은 배경을 사용하지 마세요 — 스크린샷은 엄격한 다크 모드 인터페이스를 보여줍니다
• 세리프 폰트를 사용하지 마세요 — 스크린샷은 전체적으로 현대적인 휴머니스트 산세리프를 보여줍니다
• 무거운 그림자를 추가하지 마세요 — 스크린샷은 가장 심하게 해야 부드럽고 미세한 그림자를 보여줍니다
• 다양한 색상을 사용하지 마세요 — 스크린샷은 어두운 회색, 흰색, 그리고 단 하나의 강렬한 블루로 엄격한 팔레트를 보여줍니다
• 날카롭고 각진 모서리를 사용하지 마세요 — 스크린샷은 일관되게 둥근 모서리와 필 형태를 보여줍니다
• 저대비 텍스트를 사용하지 마세요 — 스크린샷은 어두운 배경에 고대비 흰색 텍스트를 보여줍니다
• 피하기: 전문 용어
• 피하기: 격식 있는 기업 언어
• 피하기: 지나치게 복잡한 문장

10

팩 안의 실제 스크린샷

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

11

System Prompt

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