4.16.2010

Website CSS3 Code Generator



Untuk menulis CSS secara manual tidak terlalu sulit, apabila anda mengetahui mengenai properties maka anda akan dapat dengan mudah menulis CSS. Tetapi apabila anda cukup malas untuk menulis kode CSS sendiri, terdapat banyak website yang menyediakan code generator, seperti berikut ini pada CSS3 yang terdapat banyak properties baru yang sangat bermanfaat.

Sangat membantu untuk meng-generate kode CSS3 seperti border radius, box shadow, text shadow, RGBA, @font-face, multiple column, box resize, box sizing dan outline.

CSS3 Gradient Generator dibuat sebagai sebuah showcase untuk menampilkan kehebatan dari Gradient/gradasi berbasis CSS sebanding dengan tool yang digunakan oleh para developer dan designer untuk meng-generate gradient di CSS.
CSS Gradient ini meng-generate sebuah hasil berbentuk gambar, yang dimaksud bahwa CSS Gradient ini dapat digunakan di berbagai kebutuhan seperti background-image, mask, border, atau list item bullet.

Membantu dalam meng-generate Linear Gradients, Radial Gradients, Text Shadow, Box Shadow, Transform, dan Text Stroke.

Tools untuk meng-generate kode border-radius bagi orang yang malas untuk menulis secara manual.

CSS3 @font-face generator dari Font Squirell
Format yang dapat digunakan adalah :
TrueType - format yang didesain untuk tampil sempurna di layar monitor. Umumnya bagi web browser berbasis Windows
OpenType(CFF) - Format ini lebih baik digunakan untuk media cetak dan tidak selalu tampil baik di Windows.
EOT - Anda perlukan format ini apabila mentargetkan bagi Internet Explorer.
SVG - Ini adalah format XML yang didukung oleh beberapa browser termasuk iPhone
WOFF - Cross-browser, web-only font format.
Cufón - Ini bukan fomat font-face. Mengenai informasi Cufón dapat melihat pada Cufón page

Untuk yang belum pernah mengetahui propery ini, Border Image Generator mengubah sebuah gambar menjadi border dan background pada sebuah element.

Tools bernama CSS3 Please! ini menampilkan CSS Rule Generator secara sedehana, dan anda dapat bereksperimen dengan kode CSS3 disana.