·tailwind-design-system
</>

tailwind-design-system

itsjavi/vani

CSS 기반 토큰, 구성요소 패턴, 접근성 검사가 포함된 반응형 지침을 사용하여 Tailwind CSS 4로 확장 가능한 디자인 시스템을 구축합니다. 구성 요소 라이브러리를 만들거나 디자인 시스템을 구현하거나 UI 패턴을 리팩터링 및 표준화할 때 사용합니다.

4설치·0트렌드·@itsjavi

설치

$npx skills add https://github.com/itsjavi/vani --skill tailwind-design-system

SKILL.md

Design tokens, components, and responsive patterns for Tailwind CSS 4 with accessibility in mind.

Use the token extractor to keep a JSON snapshot of @theme tokens:

Return a concise report using the output template above, followed by any recommended next steps (tests, audits, or migration plan).

CSS 기반 토큰, 구성요소 패턴, 접근성 검사가 포함된 반응형 지침을 사용하여 Tailwind CSS 4로 확장 가능한 디자인 시스템을 구축합니다. 구성 요소 라이브러리를 만들거나 디자인 시스템을 구현하거나 UI 패턴을 리팩터링 및 표준화할 때 사용합니다. 출처: itsjavi/vani.

원본 보기

인용 가능한 정보

AI/검색 인용용 안정적인 필드와 명령어.

설치 명령어
npx skills add https://github.com/itsjavi/vani --skill tailwind-design-system
카테고리
</>개발 도구
인증됨
최초 등록
2026-02-01
업데이트
2026-02-18

빠른 답변

tailwind-design-system이란?

CSS 기반 토큰, 구성요소 패턴, 접근성 검사가 포함된 반응형 지침을 사용하여 Tailwind CSS 4로 확장 가능한 디자인 시스템을 구축합니다. 구성 요소 라이브러리를 만들거나 디자인 시스템을 구현하거나 UI 패턴을 리팩터링 및 표준화할 때 사용합니다. 출처: itsjavi/vani.

tailwind-design-system 설치 방법은?

터미널 또는 명령줄 도구(Terminal, iTerm, Windows Terminal 등)를 엽니다 이 명령어를 복사하여 실행합니다: npx skills add https://github.com/itsjavi/vani --skill tailwind-design-system 설치 후 스킬은 자동으로 AI 코딩 환경에 설정되어 Claude Code나 Cursor에서 사용할 수 있습니다

소스 저장소는 어디인가요?

https://github.com/itsjavi/vani