Beispiel-Themes

Jedes Theme unten besteht nur aus den 7 CSS Custom Properties – klicke auf ein Farbfeld, um das echte Banner sofort umzugestalten, und kopiere dann das CSS des Themes, das dir gefällt.

Default (dark)Der eingebaute Standard des Pakets – kein CSS nötig.Default (light)Was Besucher mit hellem Systemdesign automatisch sehen – ebenfalls ohne CSS.SkyWeiß mit navyblauen Pill-Buttons und weichen Rundungen – der helle Look dieser Website.Sky tintDas himmelblaue Markenpanel als Banner, mit navyblauem Text und Buttons.MidnightTiefes Navy mit himmelblauem Akzent – wie das Preispanel dieser Website.Charcoal & skyWeiches Anthrazit mit himmelblauem Akzent – diese Website im Dark Mode.StoneWarmes Off-White mit fast schwarzen Buttons – ruhig und redaktionell.MinimalScharfe Ecken, monochrom, Monospace – ein redaktioneller/brutalistischer Look.Lime fintechWeiß mit Chartreuse-Akzent und großzügigen Rundungen – moderne Fintech-App-Energie.Editorial darkFast Schwarz mit klarem weißem Ghost-Button-Akzent – Premium-DTC/Wellness-Gefühl.Salon darkTiefes Petrol mit Terrakotta-Akzent und kleinem Radius – Boutique/Studio-Gefühl.Warm & earthyCreme und Terrakotta mit Serifenschrift – freundlich und organisch.NeonFast Schwarz mit leuchtendem Akzent – Tech/Gaming/Krypto-Ästhetik.CorporateZurückhaltendes Blau auf Weiß mit kleinerem Radius – konservativer SaaS-Look.PlayfulPastell-Lavendel, sehr rund, abgerundete Systemschrift – weich und freundlich.

Demo zurücksetzen (löscht die gespeicherte Auswahl)

CSS für das ausgewählte Theme – in dein globales Stylesheet einfügen:

Keines davon ist „richtig“ – es sind Ausgangspunkte. Kombiniere Werte nach Belieben oder verwende ganz einfach deine eigenen Markenfarben.