Simple CSS3 Ribbons

Published on by Morgan Ney

Using ribbons is a great way to highlight text and important sections of a website. They seem to be everywhere nowadays and that's probably because CSS3 generated content makes them possible using only one HTML element and no images.

Here is an example of how to create a simple CSS3 ribbon with only one element.

This illustrates a very basic implementation of CSS3 ribbons. You can embellish it to your hearts content. Here is a live example:

Some Ribbon Text
Relevant to  HTML5, CSS3
Get in Touch

BizzyBtyes is owned by Morgan Ney, a father, husband, and web developer originally from the San Francisco Bay Area and now living in Coarsegold, Ca. just south of Yosemite.