큐레이션 · 오픈 · 무료

Baseten

깔끔하고 권위 있는 타이포그래피로 AI 모델을 배포하고 확장하기 위한, 개발자 중심 인프라 플랫폼입니다.

01

디자인 DNA

클라우드 네이티브 모델 추론을 위한 기술 설계도

02

컬러

고대비 단색 베이스와 고채도 하이라이트를 위한 단일의 생동감 있는 그린 악센트.

03

타이포그래피

grotesque-sans · ui-sans-serif · monospace

• display64px · 400
• body16px · 400
• mono14px · 400

제목은 임팩트를 위해 타이트한 마이너스 자간을 사용합니다. · 버튼과 내비게이션은 기술적 느낌을 위해 모노스페이스 대문자를 사용합니다. · 본문 텍스트는 표준 행 높이를 유지하여 높은 가독성을 유지합니다.

04

여백

패딩과 간격을 위해 일관된 배수를 사용하는 4px 기본값

05

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

구분선을 위한 미세한 1px rgba(0,0,0,0.05) 테두리와 구조적 그리드를 위한 점선.

06

레이아웃

일부 섹션에서 기본 구조를 강조하기 위해 보이는 점선이 포함된 엄격한 12열 그리드.

07

모션과 인터랙션

인터랙티브 요소에서 부드러운 색상 및 배경 트랜지션 · 콘텐츠 로딩을 위한 페이드 트랜지션

빠른 이징으로 미세한 색상 변화 또는 배경 변경. · 즉각적인 시각적 피드백.

08

컴포넌트

• button 모노스페이스 대문자 텍스트, 둥근 모양 또는 날카로운 테두리, 고대비 흰색 또는 검은색 채우기.
• card 최소화 또는 보이지 않게 하여, 구조를 위해 기본 그리드 라인에 의존합니다.
• chip 모노스페이스 텍스트가 포함된 둥근 모양의 악센트 컨테이너.
• input 미세한 테두리가 있는 표준 양식 필드.
• hero 왼쪽에 크고 굵은 타이포그래피, 오른쪽에 기술 일러스트레이션이 있는 분할 레이아웃.

09

보이스와 금지 목록

• 톤 권위 있고, 기술적이며, 직접적입니다.
• 헤드라인 타이트한 자간을 가진 굵고 선언적인 문장.
• CTA 명확한 방향 화살표를 가진, 행동 지향적 대문자 모노스페이스 버튼.

• 장식용 세리프 폰트를 사용하지 마세요 — 스크린샷은 깔끔한 기교지체Sans-serif 제목과 모노스페이스 레이블을 보여줍니다.
• 둥글고 부드러운 UI 패턴을 사용하지 마세요 — 스크린샷은 날카로운 모서리, 둥근 모양 버튼 및 기하학적 다이어그램을 보여줍니다.
• 무거운 드롭 섀도우를 사용하지 마세요 — 스크린샷은 완전히 평면적이고, 테두리가 없거나 미세한 테두리가 있는 표면을 보여줍니다.
• 다색 무지개 팔레트를 사용하지 마세요 — 스크린샷은 엄격한 흑백/그린 체계를 보여줍니다.
• UI 요소에 캐주얼한 문장 대소문자를 사용하지 마세요 — 스크린샷은 버튼과 레이블에 대문자 모노스페이스를 사용합니다.
• 그리드 구조를 숨기지 마세요 — 스크린샷은 기술적 레이아웃을 강조하기 위해 보이는 점선을 사용합니다.
• 피하기: 장난스러운 언어
• 피하기: 과도한 느낌표
• 피하기: 모호한 마케팅 용어

10

팩 안의 실제 스크린샷

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

11

System Prompt

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