Introduction

KRDS 스타일을 적용한 Radix 기반 shadcn/ui 커스텀 레지스트리 개요입니다.

What is this?

krdscn-ui는 대한민국 디지털 정부서비스 UI/UX 가이드라인과 KRDS React/HTML 리소스를 참고해 만든 커스텀 shadcn/ui 레지스트리입니다.

  • Radix 기반: 기존 shadcn/ui 프로젝트와의 호환성을 우선합니다.
  • Nova 스타일 기반: shadcn CLI의 최신 프리셋 중 KRDS와 가장 가까운 밀도와 반경을 가진 radix-nova를 선택했습니다.
  • KRDS 토큰 적용: KRDS primary, secondary, gray, danger, success, focus ring, radius를 CSS variables로 매핑했습니다.
  • Pretendard GOV: 공공서비스에 맞는 Pretendard GOV subset 폰트를 사용합니다.

Registry endpoints

빌드 결과는 정적 JSON으로 생성됩니다.

/r/registry.json
/r/krds-all.json
/r/button.json
/r/dialog.json
...

전체 설치용 엔트리는 krds-all입니다.

pnpm dlx shadcn@latest add https://krdscn.gwlee.kr/r/krds-all.json

Source references

  • KRDS 공식 사이트와 UI/UX 가이드라인
  • KRDS React Storybook
  • krds-react, krds-uiux-dev
  • Pretendard GOV
  • shadcn/ui registry workflow