Can I add color to bootstrap icons only using CSS?

Question

Twitter\'s bootstrap uses Icons by Glyphicons. They are \"available in dark gray and white\" by default:

Answer 1

The accepted answer (using font awesome) is the right one. But since I just wanted the red variant to show on validation errors, I ended using an addon package, kindly offered on this site.

Just edited the url paths in css files since they are absolute (start with /) and I prefer to be relative. Like this:

.icon-red {background-image: url("../img/glyphicons-halflings-red.png") !important;}
.icon-purple {background-image: url("../img/glyphicons-halflings-purple.png") !important;}
.icon-blue {background-image: url("../img/glyphicons-halflings-blue.png") !important;}
.icon-lightblue {background-image: url("../img/glyphicons-halflings-lightblue.png") !important;}
.icon-green {background-image: url("../img/glyphicons-halflings-green.png") !important;}
.icon-yellow {background-image: url("../img/glyphicons-halflings-yellow.png") !important;}
.icon-orange {background-image: url("../img/glyphicons-halflings-orange.png") !important;}