·design-foundation
</>

design-foundation

sanky369/vibe-building-skills

Legen Sie die Grundlage Ihres Designsystems fest oder formalisieren Sie es. Erstellen Sie Design-Tokens (Farbe, Typografie, Abstände, Schatten, Ränder), definieren Sie die Komponentenarchitektur, dokumentieren Sie Designprinzipien und bauen Sie die Struktur auf, die Konsistenz und Skalierbarkeit ermöglicht. Funktioniert mit Tailwind CSS und Framework-unabhängigen Ansätzen.

20Installationen·1Trend·@sanky369

Installation

$npx skills add https://github.com/sanky369/vibe-building-skills --skill design-foundation

SKILL.md

A design foundation is the bedrock upon which all great products are built. It's not just a collection of colors and fonts—it's a system of decisions that enables your team to build consistently, quickly, and with intention.

This skill helps you create or formalize your design foundation, whether you're starting from scratch or documenting what already exists. It covers design tokens, component structure, design principles documentation, and the governance model for your system.

Modern design systems are built on the concept of design tokens—named entities that store design decisions. Rather than hardcoding colors or spacing values throughout your codebase, tokens centralize these decisions, making them easy to maintain, theme, and scale.

Legen Sie die Grundlage Ihres Designsystems fest oder formalisieren Sie es. Erstellen Sie Design-Tokens (Farbe, Typografie, Abstände, Schatten, Ränder), definieren Sie die Komponentenarchitektur, dokumentieren Sie Designprinzipien und bauen Sie die Struktur auf, die Konsistenz und Skalierbarkeit ermöglicht. Funktioniert mit Tailwind CSS und Framework-unabhängigen Ansätzen. Quelle: sanky369/vibe-building-skills.

Original anzeigen

Fakten (zitierbereit)

Stabile Felder und Befehle für KI/Such-Zitate.

Installationsbefehl
npx skills add https://github.com/sanky369/vibe-building-skills --skill design-foundation
Kategorie
</>Entwicklung
Verifiziert
Erstes Auftreten
2026-02-01
Aktualisiert
2026-02-18

Schnelle Antworten

Was ist design-foundation?

Legen Sie die Grundlage Ihres Designsystems fest oder formalisieren Sie es. Erstellen Sie Design-Tokens (Farbe, Typografie, Abstände, Schatten, Ränder), definieren Sie die Komponentenarchitektur, dokumentieren Sie Designprinzipien und bauen Sie die Struktur auf, die Konsistenz und Skalierbarkeit ermöglicht. Funktioniert mit Tailwind CSS und Framework-unabhängigen Ansätzen. Quelle: sanky369/vibe-building-skills.

Wie installiere ich design-foundation?

Öffnen Sie Ihr Terminal oder Kommandozeilen-Tool (Terminal, iTerm, Windows Terminal, etc.) Kopieren Sie diesen Befehl und führen Sie ihn aus: npx skills add https://github.com/sanky369/vibe-building-skills --skill design-foundation Nach der Installation wird der Skill automatisch in Ihrer KI-Programmierumgebung konfiguriert und ist bereit zur Verwendung in Claude Code oder Cursor

Wo ist das Quell-Repository?

https://github.com/sanky369/vibe-building-skills