Für alle die nicht immer suchen möchten wie nochmal der CSS 3 Ausdruck für runde Ecken war ist bei dem CSS 3 Generator genau richtig. Einfach und bequem die gewünschte CSS Funktion auswählen und die Daten in die Eingabefelder geben. Anschließend das Ergebnis direkt in der Vorschau ansehen und den CSS Code kopieren. Beachtet werden, wie schon der Name der Anwendung sagt, die CSS 3 Eigenschaften aber hat ein Browser für die gewählte Konfiguration eigene proprietäre Konfigurationsmöglichkeiten werden diese auch mit angegeben.

Das Paradebeispiel für einen solchen Generator sind natürlich die runden Ecken an einem Box Element wie dem div Element mit der CSS 3 Border Radius Eigenschaft:

Für die ganz Eiligen hier der CSS Code zum direkten kopieren. In diesem Beispiel sind alle Ecken gleich rund:

-webkit-border-radius: 20px;
-moz-border-radius: 20px;
border-radius: 20px;

Und wer es ganz genau wissen möchte sollte sich auch die CSS 3 Border Radius w3c Beschreibung ansehen.

Eine weitere interessante CSS 3 Eigenschaft ist CSS 3 Box Shadow Eigenschaft. Im w3c Dokument steht, dass diese Eigenschaft noch einmal zurück genommen wurde und erst in einer der nächsten Versionen erscheinen soll. Welche Browser diese Eigenschaft dennoch unterstützen wird in dem CSS 3 Generator anhand des Browser Icons dargestellt:

Hier nochmal der Code zum direkten kopieren:

-webkit-box-shadow: 2px 3px 4px #f0e511;
-moz-box-shadow: 2px 3px 4px #f0e511;
box-shadow: 2px 3px 4px #f0e511;

Und als letztes noch der Hinweis auf die CSS 3 Text Shadow Eigenschaft (w3c Link). In diesem Screenshot ist noch zusätzlich zu sehen ab welcher Version des Browsers diese CSS Eigenschaft unterstützt wird:

Auch hier nochmal der Code zum direkten kopieren:

text-shadow: 1px 1px 1px #6600ff;

Es gibt noch ein paar weitere nette CSS 3 Eigenschaften die man mit dem Tool einfach ausprobieren kann.

(via codecandies.de)