Du hast deinen AdBlocker an?

Es wäre ein Traum, wenn du ihn für t3n.de deaktivierst. Wir zeigen dir gerne, wie das geht. Und natürlich erklären wir dir auch, warum uns das so wichtig ist. Digitales High-five, deine t3n-Redaktion

Listicle

Mit diesen Websites wirst du zum Bootstrap-Profi

(Screenshot: Bootstrap)

Es gibt viele nützliche Websites zum Frontend-Framework Bootstrap. Hier findest du eine Liste aller interessanten Seiten rund um Themes, UI-Kits, Tools und Blogs.

Im Internet lassen sich jede Menge Websites finden, die das Thema Bootstrap behandeln. Da kann man schnell den Überblick verlieren. Um dem entgegenzuwirken, haben wir die wichtigsten Seiten hier sauber aufgelistet.

Code-Schnipsel für Bootstrap

Warum selbst etwas machen, wenn sich andere bereits die Mühe gemacht haben? Durchstöbert die Code-Schnipsel der folgenden Seiten inklusive einer Vorschau. Als Inspiration, Hilfestellung oder einfach zum Copy-and-paste.

Bootsnipp

Bootsnipp ist ein Portal, bei dem Web-Entwickler und -Designer Code-Schnipsel für Bootstrap hochladen können. Diese lassen sich dann inklusive einer kleinen Vorschau einsehen.

Die Vorschau-Ansicht eines Code-Schnipsels auf Bootsnipp. (Screenshot: Bootsnipp/t3n.de)
Die Vorschau-Ansicht eines Code-Schnipsels auf Bootsnipp. (Screenshot: Bootsnipp/t3n.de)

Bootdey

Auf Bootdey findest du ein Komplettpaket aus Code-Schnipseln, Templates und Plugins für Bootstrap, HTML, CSS und Javascript. Auch bei Bootdey ist eine Vorschau-Funktion mit an Bord.

Die Vorschau-Funktion eines Code-Schnipsels auf Bootdey. (Screenshot: Bootdey/t3n.de)
Die Vorschau-Funktion eines Code-Schnipsels auf Bootdey. (Screenshot: Bootdey/t3n.de)

Gestalte dein eigenes Bootstrap

Deine Bootstrap-Elemente kannst du kompliziert in einer CSS-Datei anpassen oder du schaust auf folgenden Seiten vorbei und nutzt einen komfortablen Editor mit einer Live-Vorschau.

Bootstrap-Magic

Bootstrap-Magic gibt dir die Möglichkeit, alle Bootstrap-Elemente mit Farben, Textgrößen, Abständen und vielem mehr anzupassen. Die Einstellungen werden in einer Vorschau auch direkt angezeigt. Neben dem gut aufbereiteten Editor kannst du auch direkt per HTML Elemente anpassen. Dein Design kann als CSS- und SCSS-Dateien gespeichert werden.

Der Editor von Bootstrap-Magic. (Screenshot: Bootstrap-Magic/t3n.de)
Der Editor von Bootstrap-Magic. (Screenshot: Bootstrap-Magic/t3n.de)

Bootstrap-Build

Wer eine Alternative zu Bootstrap-Magic sucht, sollte sich Bootstrap-Build näher anschauen. Hier kannst du direkt die HTML-Elemente sowie die Styles in einem passenden Editor inklusive einer Vorschau anpassen. Deine Einstellungen können direkt als CSS- und SCSS-Dateien exportiert werden.

Der Bootstrap 4 Theme-Builder. (Screenshot: Bootstrap-Build/t3n.de)
Der Bootstrap 4 Theme-Builder. (Screenshot: Bootstrap-Build/t3n.de)

Die besten Quellen für Bootstrap-Themes und Toolkits

Designrevision

Designrevision hat zwei spannende UI-Toolkits für Bootstrap 4. Darunter das kostenlose Frontend-Kit Shards sowie ein kostenpflichtiges Dashboard-Template. Beide fallen durch einfaches und modernes Design auf. Bei beiden Kits stehen die Sketch- und SCSS-Dateien zur Verfügung, wodurch du einfach Layouts verändern und ergänzen kannst.

Die Cards im Shards-Kit von Designrevision. (Screenshot: Designrevision/t3n.de)
Die Cards im Shards-Kit von Designrevision. (Screenshot: Designrevision/t3n.de)

Bootswatch

Eine gute Quelle für kostenlose Bootstrap-Themes findest du bei Bootswatch. Dort kannst du über 20 verschiedene Themes durchstöbern, die alle Open-Source und frei zugänglich sind.

Auf Bootswatch findest du über 20 kostenlose Bootstrap-Themes. (Screenshot: Bootswatch/t3n.de)
Auf Bootswatch findest du über 20 kostenlose Bootstrap-Themes. (Screenshot: Bootswatch/t3n.de)

Weitere Quellen für Themes sowie spannende Bootstrap-Blogs und lehrreiche Tutorials findest du auf der nächsten Seite.

Bitte beachte unsere Community-Richtlinien

Schreib den ersten Kommentar!

Du musst angemeldet sein, um einen Kommentar schreiben zu können.

Jetzt anmelden

Finde einen Job, den du liebst