All Annotations of Spiffy Corners - Making anti-aliased rounded corners with CSS [Preview]

saved by90 people, first byMatt scifo on 2006-03-27, last byChris Alonzo on 2008-08-15

Spiffy Corners is a simple way to generate the CSS and HTML you need to create anti-aliased corners without using images or javascript.
What?

Spiffy Corners is a simple way to generate the CSS and HTML you need to create anti-aliased corners without using images or javascript.

Why?

I needed a way to create anti-aliased round corners without the extra server calls that are incurred when using external JavaScript files or images. When your websites are serving millions of files a day you start to pay attention to how many files a particular page needs in order to load.

There are solutions for rounded corners using pure CSS. There are solutions that create anti-aliased corners. There are solutions that don't require JavaScript. But to my knowledge, there has yet to be a pure CSS solution for rounded corners that does not require images or JavaScript. After looking, I decided to just create one myself. I'm not much of a programmer, but it was actually a lot of fun figuring out the math involved and learning arrays. In the end I ended up with 3 functions in under 20 lines of code total, so I'm quite happy with myself.

on 2006-03-27 Ycc2106

Spiffy Corners is a simple way to generate the CSS and HTML you need to create anti-aliased corners without using images or javascript.
on 2006-03-27 Ycc2106

and no images
on 2006-05-18 Pixelator

Spiffy Corners is a simple way to generate the CSS and HTML you need to create anti-aliased corners without using images or javascript.
on 2006-07-25 Bgtasoft

Cuadros con esquinas redondas en HTML, sin javascript.
on 2006-07-26 Mellonstock

Anti-aliased rounded corners using pure CSS. No Images. No Javascript. No fluff.
on 2006-09-05 Chusrp

Spiffy Corners Anti-aliased rounded corners using pure CSS. No Images. No Javascript. No fluff.
on 2006-09-05 Netrunner

Anti-aliased rounded corners using pure CSS. No Images. No Javascript.
on 2006-09-06 Garraxxi

Esquinas redondeadas
on 2006-09-10 Cryfreeman

bordes redondeados en html
on 2006-10-24 Kgl0903

純css打造的無鋸齒邊框圓角

All Annotations of Spiffy Corners - Making anti-aliased rounded corners with CSS[Preview]