- Allgemeines

Darum nutzen wir Tailwind CSS

Tailwind CSS

Tailwind CSS vs. Bootstrap vs. Foundation

Schon seit Jahren nutzen wir bei der Frontend-Entwicklung das CSS-Framework „Tailwind CSS“ – welches gebenüber anderen CSS-Frameworks wie Bootstrap oder Foundation deutliche Vorteile bietet.

Für uns war entscheidend:

  • Flexibilität und Kontrolle: Unsere Programmierer können Designs frei und vollkommen individuell umsetzen,, ohne sich an vordefinierte Komponenten halten zu müssen.
  • Effiziente Entwicklung: Durch die Verwendung von Utility-Klassen können wir Styles direkt im HTML anwenden, was den Entwicklungsprozess beschleunigt.
  • Konsistenz im Design: Die zentrale Definition von Designparametern wie Farben, Abständen und Schriftgrößen fördert ein einheitliches Erscheinungsbild.
Tailwind CSS Logo

Die jetzt erschienene und komplett überarbeitete Version Tailwind CSS 4.0 nutzt die neue Engine „Oxide“ , was zu erheblichen Leistungssteigerungen und sehr reduzierten Build-Zeiten (die Zeit in der der Programmierrcode komipiliert wird) führt:

  • Vollständige Builds: Bis zu 5-fach schneller.
  • Inkrementelle Builds: Über 100-fach schneller, mit Build-Zeiten im Mikrosekundenbereich.

Und anstelle der traditionellen tailwind.config.js-Datei erfolgt die Konfiguration nun direkt in der CSS-Datei mittels der @theme-Direktive. Dies ermöglicht eine nahtlose Integration von Design-Tokens als native CSS-Variablen. Außerdem wurde die automatische Inhaltserkennung verbessert und Tailwind CSS bietet erweiterte Designfunktionen (Container Queries, 3D-Transformations-Utilities, erweiterte Farbpaletten, etc.)