Artikel

5 nützliche CSS3 Generatoren

Ein Webentwickler sollte mit CSS (Cascading Style Sheets) bereits in Kontakt gekommen sein. CSS ist die Standard-Stylesheetsprache für Webseiten. Mit ihrer Hilfe wird der HTML-Code gestylt, damit die endgültige Webseite schön aussieht. Reine HTML-Seiten sind im Jahre 2011 nämlich nicht mehr zeitgemäß. In den letzten Monaten wurde die neue Version 3 von CSS immer bekannter. CSS3 wird in einigen Jahren der neue Standard sein und Webseiten noch viel weiter aufhübschen. Mit der neuen Version kommen nämlich viele neue CSS-Regeln daher, die beispielsweise Schatten oder Verläufe darstellen. Wer sich nicht in alle neuen Details einlesen möchte, kann auch auf eine Menge CSS3-Generatoren zugreifen. Diese erstellen zum Beispiel schöne Buttons oder sexy Farbverläufe! Wir haben hier fünf nützliche Generatoren herausgesucht, die Webdesigner kennen sollten.

Border-Radius.com

Runde Kanten erstellen

Border-Radius.com ist ein tolles Tool um schnell die CSS3-Regeln für runde Ecken zu bekommen. Der Code kann auf jeden Div-Container angewendet werden und rundet diesen ab. Früher musste dies umständlich mit Grafiken geschehen. Heute gibt es dazu einen kurzen CSS3-Code, der in allen aktuellen Browsern funktioniert.

Border-Radius.com

Colorzilla.com/gradient-editor

Farbverläufe leicht erstellen

Wer Div-Container oder Buttons mit einem Farbverlauf gestalten möchte, muss auch nicht mehr einen umständlichen Weg mit Grafiken wählen. Mit CSS3 ist es möglich Verläufe direkt in das CSS-Dokument zu schreiben. Dazu bietet gibt es unter Colorzilla.com/gradient-editor einen tollen Generator für CSS3 Farbverläufe.

Colorzilla.com/gradient-editor

CSS-Tricks.com ButtonMaker

Sexy Buttons generieren

Wer mal schnell einen schönen CSS-Button benötigt, kann den CSS-Tricks.com ButtonMaker benutzen. Dieser Generator hilft euch dabei zeitgemäße CSS-Buttons zu erstellen. Dazu legt ihr Einstellungen wie Farben und Größe fest und schon könnt ihr den passenden Code exportieren.

CSS-Tricks.com ButtonMaker

Border-Image.com

Bilder im Border (Rand)

Ein neues CSS3-Feature ist Border-Image. Damit könnt ihr Bilder in den Rand eines Containers setzen. Border-Image.com ist der passende Generator hierfür. Bild hochladen, Einstellungen festlegen und schon könnt ihr den CSS-Code aus der Box unten für eure Zwecke kopieren.

Border-Image.com

CSS3Menu.com

CSS3 Menü Generator

Jeder Webdesigner braucht früher oder später ein tolles Menü für die Navigation. Natürlich können hier mit CSS3 richtig schöne Ergebnisse erzielt werden. Hilfe bekommt ihr mit CSS3Menu.com. Die Webseite bietet eine Anwendung zum Download an, mit der ihr komplexe Menüs erstellen könnt. Wer die Ergebnisse allerdings kommerziell benutzen möchte, muss eine Lizenz für mindestens 49 Dollar kaufen.

CSS3Menu.com