Design System
검증된 스냅샷 기준

디자인 원천을 계약으로, 계약을 제품으로.

YAML 원천을 결정론적으로 컴파일해 토큰과 recipe를 만들고, React 어댑터는 접근성과 DOM만 책임집니다. 값은 한 곳에서만 정의됩니다.

컴포넌트 보기AI 예제
Public tokens
319
Components
44
Catalog entries
56
Snapshot
1bf6565

계층

  1. 01

    Source contract

    provenance, 토큰, recipe, guidance를 원본 의미 그대로 보존합니다.

    design-system/
  2. 02

    Design core

    토큰과 recipe를 런타임 파싱 없이 CSS 변수와 타입으로 컴파일합니다.

    @repo/design-core
  3. 03

    Framework adapter

    접근 가능한 DOM과 상태 API를 React로 구현합니다. Next 의존성은 없습니다.

    @repo/ui
  4. 04

    Product composition

    App Router가 라우팅과 서버 조합을 맡고 클라이언트 경계는 leaf에 둡니다.

    apps/web

단일 소스 원칙

recipe 값은 컴파일러가 CSS 변수로 내보내고, 어댑터는 레이아웃과 접근성만 매핑합니다. 값을 손으로 복사한 곳은 없습니다.