8 Online CSS3 Generatoren

Frei nach dem Motto: lieber schnell zusammen geklickt, als falsch selbst gemacht, habe ich mal eine Liste von 10 guten CSS3 Online Editoren erstellt. Ich denke da ist für jeden was dabei, und es ist auch nicht schlimm wenn man sie benutzt: man muss nicht immer alles selbst machen! ;)

CSS3.me

Screenshot con CSS3.me

Mit CSS3.me kann man Boxen mit runden Ecken, Gradients und Schatten mittels Slider erstellen. Opacity ist auch möglich, eine schöne und schnelle Lösung wenn man mal etwas herum experimentieren will.

CSS3 Maker

Screenshot von CSS3 Maker

Der CSS3 Maker deckt mehr oder weniger den gesamten Bereich des CSS3 ab, man kann via Tabs zwischen den einzelnen Bereichen umschalten. Mir gefällt das User Interface nicht sonderlich, ich hab nichts mehr übrig für dunkle Seiten, deshalb verwende ich CSS3 Maker so gut wie gar nicht.

CSS3 Generator

Screenshot des CSS3 Generators

Der CSS3 Generator deckt ebenfalls das gesamte Feld ab, hat aber eine freundlichere Benutzeroberfläche. Das Tool ist glaube ich der erste Generator der in das Licht der Öffentlichkeit gerückt ist, und erfüllt nach wie vor hervorragend seinen Dienst.

CSS3-Tricks Button Maker

Screenshot des Button Makers

Wenn CSS3 irgend etwas gebracht hat, dann exzessive Button-Design-Exzesse! ;) Leider sind die Buttons aber händisch nicht ganz einfach zu erstellen, so dass zunächst Button-Vorlagen-Seiten, und anschließend Button-Generatoren schwer in Mode waren. Der Button Maker von CSS3-Tricks bietet jede Menge Einstellmöglichkeiten und vor allem schon vorgefertigte Demos, die schnell verwendet werden können.

 CSS3Button.net

Screenshot von CSS3Button.Net

CSS3Button.Net ist ebenfalls ein Button Generator, der in diese Liste geraten ist, da er als einer der wenigen Generatoren das resultierende CSS direkt anzeigt. Das ist eine wichtige Sache wie ich finde, da man so die Änderungen direkt live mitverfolgen kann, und so am meisten lernt.

Border Image Generator

Screenshot vom Border Image Generator

Seit CSS3 lassen sich ja auch Bilder für einen Border einsetzen, leider sind die Effekte nicht ganz einfach zu überschauen. Hier hilft prima der Border Image Generator, der mittels verschiedener Bilder die besten Einstellungen für einen solchen Rahmen finden kann.

Ultimate CSS3 Gradient Generator

Css3 Gradient Generator

Gradients sind auch neu mit CSS3 gekommen und wurden zunächst vornehmlich für Buttons eingesetzt, man kann die aber auch für andere Elemente verwenden. Der Ultimate CSS3 Gradient Generator ist ganz nett, da er bereits vorgerfertigte Templates anbietet, auf die man aufbauen kann. Das Tool gibt es übrigens auch als Extension für Firefox und Chrome.

CSS3 Please

Screenshot von CSS3 Please

CSS3 Please ist im eigentlichen Sinne kein Generator sondern eine Art Online-Sandkasten. Im Default zeigt es eine komplett in CSS3 gestaltete Box an, und deren CSS in einem Editor. Ich kann jetzt hingehen und das CSS schnell und einfach ändern und direkt live die Änderungen betrachten. Prima zum lernen und Ausprobieren!

 

Ähnliche Beiträge

Heatmap mit dem HTML5 Canvas Element Heatmaps sind sinnvolle kleine Helferlein bei der Analyse einer Webpage. Ich habe schon darüber berichtet wie man mit der Open Source Clickheat eine f...
Zebra – der Desktop im Browser mit HTML5 Inzwischen sollte es sich bis in die hinterste Ecke herum gesprochen haben das in ein paar Jahren alles in der Cloud passiert, und somit im Browser. I...
JavaScript Markdown Editor Markdown ist nichts nerdiges (mehr) sondern durchaus eine sinnvolle Sache, auf der viele Dienste inzwischen setzen (so zum Beispiel auch GitHub). Waru...
Webflow – komplettes CSS3 für Seiten online ... CSS3 Online-Editoren gibt es ja einige in der Cloud. Meistens sind diese für spezialisierte Anwendungen wie zum Beispiel Gradients oder Buttons. Will ...

Schreibe einen Kommentar

Deine E-Mail-Adresse wird nicht veröffentlicht. Erforderliche Felder sind mit * markiert.