프로젝트 소개

Transitions.dev는 40개 이상의 정교한 CSS 전환을 대화형 라이브러리로 제공합니다. 단순한 카드 크기 조정과 텍스트 교체부터 복잡한 스프링 기반 애니메이션과 알림 배지까지 다양한 패턴을 포함합니다. 각 전환은 의미론적 CSS 사용자 정의 속성과 네임스페이스 클래스를 사용하여 기존 스타일과 충돌 없이 어떤 프로젝트에든 바로 적용할 수 있도록 설계되었습니다. 주요 기능은 다음과 같습니다: - CSS 라이브러리: 복사하여 바로 사용할 수 있는 상호작용 패턴 모음. - CLI 통합: `npx transitions-dev add` 명령으로 특정 전환을 코드베이스에 직접 추가할 수 있습니다. - AI 에이전트 스킬: 에이전트 스킬로 설치 가능하여 Cursor나 Claude Code 같은 AI 코딩 어시스턴트가 이 전환들을 컴포넌트에 직접 적용할 수 있습니다. - Refine 도구: 실행 중인 애플리케이션에 실시간 타임라인과 제어판을 주입하는 동반 CLI로, 모션 매개변수를 조정하거나 기존 CSS 전환을 AI 지원 제안을 통해 라이브러리 표준 토큰으로 교체할 수 있습니다. - 개발자 친화성: 라이브러리, CLI, AI 스킬이 쇼케이스 사이트와 동기화되도록 보장하는 빌드 시스템을 포함합니다.