faking advanced css

when some people find a well-designed blog with a few neat tricks, they tend to automatically assume the owner is a css genius who’s the next big designer to hit the web.

that very well may be the case but more often than not the designer is using ‘tools’ that you just haven’t discovered yet. here’s five web generators that will make you look like nick la!

csstypeset

csstypset is handy tool for seeing the effect of css code while simultaneously seeing what’s going on behind the scenes with the actual code. it works both ways, you can type code and immediately see it applied to text, or you can type text and use a gui with sliders to apply css to your text. if you have a hard time figuring out the difference between em and px, verdana and helvetica then this is the tool for you.

 

text2png

add a few lines of javascript to your header and this nifty web tool converts your headlines to images automatically.

 

csstextwrap

sick of ‘designing to an invisible grid’? turn that grid into origami and spice up your layouts with this incredible text wrap tool.

 

kotatsu

you may have tried to make xhtml tables that could be marked up with php, javascript or ajax before. if only i had known about this tool then! essentially it’s a html table generator.

 

goldenrationcalculator

divine proportions have been used for all types of creative work, from architecture to print layout to photography. it’s only natural that it also eventually found it’s way into web design. this web generator makes it easy to design using the ‘golden ratio’ as the underlying framework for your website’s design.