큐레이션 · 오픈 · 무료

Inngest

모든 코드를 기본적으로 내구성 있게 만드세요.

01

디자인 DNA

실패 없이 실행되어야 하는 코드를 위한 신뢰할 수 있는 산업급 플랫폼.

02

컬러

주요 액션을 위한 단일 골든 강조색과 웜 스톤 뉴트럴을 사용하는 어두운 고대비 테마.

03

타이포그래피

geometric-sans · humanist-sans · monospace

• display60px · 500
• body16px · 400

디스플레이 타입은 최대 효과를 위해 -2px의 좁은 자간을 사용합니다. · 본문 텍스트는 어두운 배경에서 최적의 가독성을 위해 표준 16px로 설정합니다. · 주요 브랜드 폰트는 깔끔한 기하학적 sans-serif입니다.

04

여백

섹션 간 호흡 공간을 위한 여유로운 간격의 일관된 4px 그리드 시스템.

05

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

날카로운 대비 없이 가장자리를 정의하기 위한 미세한 1px 테두리, rgba(168, 162, 158, 0.2) 사용.

0px 1px 2px rgba(0, 0, 0, 0.1) · 0px 1px 3px rgba(0, 0, 0, 0.1)

06

레이아웃

여유로운 수직 여백과 명확한 시각적 계층을 갖춘 중앙 정렬 콘텐츠 레이아웃.

07

모션과 인터랙션

hover 시 미세한 색상 및 배경 전환. · 인터랙티브 요소의 변환.

버튼과 링크의 배경색이나 불투명도 미세한 변화. · 변환 또는 불투명도 변화로 즉각적인 시각적 피드백.

08

컴포넌트

• button 주요 버튼은 골든 강조색과 어두운 텍스트를 사용; 보조 버튼은 투명 배경과 흰색 테두리를 사용합니다.
• card 미세한 테두리와 약간의 패딩을 갖춘 어두운 컨테이너(bgSoft/bgQuiet).
• chip 태그 또는 레이블에 사용되며, 종종 미세한 테두리나 은은한 배경색을 사용합니다.
• input 미세한 테두리와 포커스 상태를 갖춘 깔끔하고 미니멀한 입력 필드.
• hero 추상적인 기하학적 배경 패턴과 결합된 크고 굵은 타이포그래피.

09

보이스와 금지 목록

• 톤 자신감 있고 기술적이며 신뢰성 중심적.
• 헤드라인 간결하고 임팩트 있으며 혜택 중심적 (예: 'Make any code durable by default').
• CTA 직설적이고 행동 지향적 (예: 'Start building for free', 'Get a demo').

• 밝은 네온색을 사용하지 마세요 — 스크린샷은 은은한 스톤과 골든 톤을 보여줍니다.
• 넓고 장식적인 타이포그래피를 사용하지 마세요 — 스크린샷은 좁고 기하학적인 sans-serif 헤드라인을 보여줍니다.
• 무거운 그림자나 글래스모피즘을 사용하지 마세요 — 스크린샷은 미세하고 평면적인 테두리 기반 깊이를 보여줍니다.
• 배경에 순수 블랙(#000000)을 사용하지 마세요 — 스크린샷은 웜 오프블랙(#0C0A09)을 보여줍니다.
• 주요 버튼에 둥근 필形状을 사용하지 마세요 — 스크린샷은 날카로운 4px 모서리를 보여줍니다.
• 여러 경쟁 강조색을 사용하지 마세요 — 스크린샷은 단일 지배적인 골든 강조색을 보여줍니다.
• 피하기: 지나치게 캐주얼하거나 장난스러운 언어를 피할 것.
• 피하기: 불확실한 마케팅 수사를 피할 것.
• 피하기: 맥락 없이 복잡한 전문 용어를 사용하지 말 것.

10

팩 안의 실제 스크린샷

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

11

System Prompt

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