CSS shapes are here

Heads up! This post was written in 2014, so it may contain information that is no longer accurate. I keep posts like this around for historical purposes and to prevent link rot, so please keep this in mind as you're reading.

— Cory

Here's something exciting from the CSS world: shapes!

Ok, it may not sound all that exciting, but you haven't had a chance to see what can actually be done with CSS shapes yet. (Hint: check out the featured image above.)

Razvan Caliman explains it like this:

For a long time, web designers have been forced to create within the constraints of the rectangle. Most content on the web is still trapped in simple boxes because most creative ventures into non-rectangular layout end in frustration.

It's true. We didn't even get "circles" until border-radius came around, and even then you'd have to expect IE8 and below to fallback to a square. We've been confined to boxes for a long time.

So how are things changing? See for yourself over at HTML5 Rocks. It's the best intro to CSS shapes I've seen so far.