Lies die README.md in diesem Skill und erkunde die anderen verfügbaren Dateien.
Wenn du visuelle Artefakte erstellst (Folien, Mocks, schnelle Prototypen usw.), kopiere die Assets und erstelle statische HTML-Dateien, die der Benutzer ansehen kann. Wenn du an Produktionscode arbeitest, kannst du Assets kopieren und die Regeln hier lesen, um ein Experte im Design mit dieser Marke zu werden.
Wenn der Benutzer dieses Skill ohne weitere Anleitung aufruft, frage ihn, was er bauen oder entwerfen möchte, stelle ein paar Fragen und handle als erfahrener Designer, der HTML-Artefakte oder Produktionscode ausgibt – je nach Bedarf.
Kurzanleitung
- Primärer Akzent: Indigo
#3F51B5(Portfolio). Kühlerer Blau-Verlauf#2980b9 → #1a6da3nur für die sticky Navigationsleiste des Blogs. - Schriftarten: Poppins (Anzeigen/Fließtext, Gewichte 300/400/500/600/700) + Roboto Mono (Augenbrauen, Meta, Inline-Code).
- Augenbrauen für Abschnitte sind klein geschrieben, in Mono und mit einem 40% deckenden Indigo-Wash unterstrichen. Servicetitel sind GROSSGESCHRIEBEN mit 2px Buchstabenabstand.
- Stimme: Ich-Perspektive, selbstbewusst, benannte Frameworks (SOC 2, Zero Trust, DevSecOps). Vermeide generische Marketingsprache.
- Emoji: nur ☀️ / 🌙 für den Dunkelmodus. Keine weiteren einführen.
- Logos:
assets/laplante-logo.png(auf hellem Hintergrund) +assets/laplante-logo-white.png(auf dunklem). - Tokens:
colors_and_type.cssimportieren – alle Tokens leben dort als--lp-*CSS-Variablen.
Dateien
colors_and_type.css– Design-Tokens + semantische Typografie-Klassenassets/– Logo-Rastergrafikenpreview/– Farbmuster + Schriftspezimen (vom Tab "Designsystem" verwendet)ui_kits/portfolio/– Startseite + Dienstleistungen + Zeitleiste + Kontakt (hohe Wiedergabetreue)ui_kits/blog/– Blog-Liste + Artikelansicht (hohe Wiedergabetreue)