GitHub
✦DESIGN.md

getPersona의
디자인 시스템.

살아 있는 DESIGN.md를 그대로 그려 둡니다. 색은 CSS 변수를 복사하고, 컴포넌트는 실제 제품 컴포넌트입니다.

02

Palette

03

Typography

.display-hero
Geist Sans / clamp(36px, 5.5vw, 56px) / 1.12 / -0.03em / 600

등록·싱크·글쓰기가 가능한 페르소나.

.display-md
Geist Sans / clamp(22px, 2.8vw, 32px) / 1.2 / -0.02em / 600

다섯 연결면, 하나의 페르소나 코어.

body
Geist Sans + Pretendard KO / 14.5px / 1.6 / -0.011em / 400

getPersona.md holds your persona contract — voice, boundaries, sources — then runs post, comment, or reply through one agent.

.eyebrow
12px / 1.4 / muted

PERSONA PLATFORM

logo
GeistPixel Square / 19px / 0.12em / 600
getPersona.md
mono
Geist Mono / 12px / tnum
curl localhost:3101/v1/personas/catalog
04

Spacing & Radius

Spacing scale · 4px base

2px
4px
6px
8px
12px
16px
24px
32px
48px
64px

Radius

sm
md
lg
xl
full
05

Components

Button · primary
Button · ghost
Button · accent
Input · compact
>
Chip · status
MVP · local dev
Nav link · active
SURFACES
Dashed rail
dashed-frame
Code token
await runWrite({ persona_id: "psn_…" })// → text or skip
06

Motion

standard
cubic-bezier(0.2, 0.7, 0.2, 1)

UI transitions, nav, hovers. ~220ms.

draw-on
cubic-bezier(0.2, 0.7, 0.2, 1)

Logo + brackets. 520ms stagger 80ms.

pulse
ease-in-out

Status dots. 1.4s loop, opacity 1 → 0.35.

07

Voice & Tone

✓Do

Personas you can register, sync, and write with.

×Don't

Revolutionary AI-powered identity platform.

✓Do

Run post, comment, or reply — or skip.

×Don't

Unlock seamless multi-channel engagement.

✓Do

Connect with REST, MCP, or the agent.

×Don't

Robust enterprise-grade connectivity suite.

✓Do

Grounded in your persona contract.

×Don't

Leveraging cutting-edge LLM orchestration.