피드로 돌아가기
InfoQInfoQ
Frontend

shadcn CLI v4 Registry 기반 폰트 시스템 자동화 및 배포

Fonttrio Launches as Open-Source Font Pairing Registry for shadcn/ui

Daniel Curtis2026년 5월 9일2beginner

Context

웹 애플리케이션 설계 시 폰트 선정, 페어링, CSS 설정에 소요되는 반복적 수동 작업 발생. 기존의 Fontjoy나 Fontpair 같은 도구는 시각적 추천만 제공할 뿐 실제 프레임워크 설정과 연동되지 않는 파편화된 워크플로우의 한계 존재.

Technical Solution

  • shadcn CLI v4의 registry:font 타입을 활용한 Typography System의 모듈화 및 배포 구조 설계
  • 단일 CLI 명령어로 Heading, Body, Monospace 폰트 세트를 일괄 설치하는 자동화 파이프라인 구축
  • next/font 기반의 폰트 최적화와 globals.css 내 CSS Custom Properties(--font-heading 등) 자동 매핑 체계 적용
  • h1부터 body까지 일관된 Typography Scale을 자동 생성하여 디자인 시스템의 일관성 확보
  • npx shadcn@latest apply --preset <code/> --only font 명령어를 통한 부분적 Preset 적용 기능 지원
  • TypeScript 기반의 Open-source Registry 구조를 통해 커뮤니티 주도의 Composable Tooling 생태계 확장

1. 단순 추천 도구를 넘어 CLI 기반의 설정 자동화(Configuration as Code)가 가능한지 검토

2. 디자인 시스템의 변수(CSS Variables)를 프레임워크 수준의 Registry와 연동하여 배포 프로세스 단축

3. 전체 Preset 대신 특정 도메인(예: Font)만 선택적으로 적용하는 Partial Application 전략 고려

원문 읽기