design-system-starter
Buduj spójne systemy designu z tokenami, komponentami i wytycznymi dostępności
Instalacja
Wybierz klienta i sklonuj repozytorium do odpowiedniego katalogu skilli.
Instalacja
O skillu
Skill do tworzenia i rozwijania systemów designu dla aplikacji React i innych projektów frontendowych. Otrzymujesz gotowe tokeny designu (kolory, typografię, spacing), architekturę komponentów opartą na atomic design, wsparcie dla dark mode'u oraz wytyczne dostępności WCAG 2.1 AA. Wszystko z szablonami dokumentacji i checklist'ą audytu systemu.
Jak używać
Zainstaluj skill w swoim środowisku Claude lub Copilota, wskazując repozytorium davila7/claude-code-templates.
Opisz swoją potrzebę w naturalnym języku, na przykład: "Stwórz system designu dla mojej aplikacji React z obsługą dark mode'u" lub "Ustaw tokeny designu dla kolorów i spacing'u".
Skill wygeneruje tokeny designu w formacie JSON zgodnym ze standardem W3C, zawierające kolory, typografię, spacing i cienie.
Otrzymasz architekturę komponentów zorganizowaną wg metodologii atomic design (atomy, molekuły, organizmy) wraz z szablonami React komponentów.
Jeśli potrzebujesz dark mode'u, skill skonfiguruje zmienne CSS lub ThemeProvider do dynamicznego przełączania tematów.
Przejrzyj dołączone szablony dokumentacji i checklist audytu systemu designu, aby upewnić się, że wszystkie komponenty spełniają standardy dostępności i są prawidłowo udokumentowane.