enjoyCSS

enjoyCSS – CSS3 Online-Generator

Ein weiterer Eintrag in der Kategorie der Online-Generatoren, enjoyCSS.

Ob Text, Textfelder, Buttons, Rahmen, Schatten, Radien … etc. etc., enjoyCSS ist ein Online Generator, der einem Routinearbeiten, wie z.B. das Formatieren von Text, Hintergrund oder Buttons, Transitionen, Transformationen etc. abnehmen will.

Obwohl er in englischer Sprache gehalten ist, bleibt die grafische Oberfläche leicht zu verstehen und bedienen.

Hier (m)ein kleines Beispiel, das ich in wenigen Augenblicken dort online erstellt habe.

Den Code kann man gleich per copy&paste mitnehmen und in seine Webseite einfügen.

enjoyCSS

i2style CSS3 button Generator Button-Vorlagen

i2style bietet eine Reihe CSS3 buttons an, die man direkt als Vorlage nehmen und dann weiter bearbeiten kann, bis sie den eigenen Vorstellungen entsprechen.

? CSS3 ?

Den so erstellten code kann man gleich per copy&paste mitnehmen.

sciweavers i2style css3 button

LINK: www.sciweavers.org/i2style

patternify – CSS Pattern Generator

Ein weiterer Eintrag in der Kategorie „CSS-Generatoren“. Auf www.patternify.com könnt ihr euch ein eigenes kleines Muster erstellen, welches ihr dann zum Beispiel als Hintergrund verwenden möchtet.

Erstellt online euer Muster (es gibt auch einige Vorlagen, die ihr auswählen und anpassen könnt) und ladet dann entweder eine Grafik im png-Format herunter oder nehmt den Base64 Code mit, den ihr in eurer CSS verwenden könnt. Für mein Beispiel mit den pink Herzchen 😀 sieht der CSS-Eintrag dann etwa so aus:

What is Patternify?

Patternify is a simple pattern generator. I built it to save myself the pain of launching Photoshop just to export a 2px by 2px stripe pattern. Not only can you build your pattern online, but with the base64 code, you don’t even need an image file anymore: just include the code in your CSS and you’re ready to go!

CSS triangle (Dreieck) generator

Du willst oder musst gerade „auf die Schnelle“, nur mit CSS-Eigenschaften, ein oder mehrere Dreiecke online erstellen?

Gefunden habe ich ein kleines Werkzeug auf der Webseite von Andre Knieriem, mit welchem du dir ein Dreieck online generieren und den CSS Code gleich mitnehmen kannst.

Ein Dreieck …

… und noch ein Dreieck …

Screenshot des Online-Dreick-Generators:

css-triangle-generator

pi(x)[css]el-Kunst

Du willst auch Deine eigene Pixel-Kunst picssel-art nur mit CSS erstellen?

Create pixel art using only CSS.

„… piCSSel-art is a drawing app to draw pixel art and get it in CSS. Yes, you heard it right, CSS. The app converts each pixel to corresponsing box-shadow CSS and generate HTML and CSS code which you can use to put that art on your page. …“

piCSSel-art

Hier ist meine Pixel-Kunst. A smile 🙂