Note to self: use the Bob Ross CSS that Thomas Park conveniently worked out.

Here’s a nice little clip in case you don’t know who Bob Ross is.

“We don’t make mistakes. We just have happy accidents”

I like that. And his insistence on sticking to a limited palette was kind of inspiring too. Sometimes we get overloaded by choice. Maybe it’s better to get a solid core of colors - or tools - and work with those.

The Bob Ross CSS Palette

.sap-green {
  background-color: #0A3410;
}
.sap-green-text {
  color: #0A3410;
}
.sap-green-border {
  border-color: #0A3410;
}

.alizarin-crimson {
  background-color: #4E1500;
}
.alizarin-crimson-text {
  color: #4E1500;
}
.alizarin-crimson-border {
  border-color: #4E1500;
}

.van-dyke-brown {
  background-color: #221B15;
}
.van-dyke-brown-text {
  color: #221B15;
}
.van-dyke-brown-border {
  border-color: #221B15;
}

.dark-sienna {
  background-color: #5F2E1F;
}
.dark-sienna-text {
  color: #5F2E1F;
}
.dark-sienna-border {
  border-color: #5F2E1F;
}

.midnight-black {
  background-color: #000000;
}
.midnight-black-text {
  color: #000000;
}
.midnight-black-border {
  border-color: #000000;
}

.prussian-blue {
  background-color: #021E44;
}
.prussian-blue-text {
  color: #021E44;
}
.prussian-blue-border {
  border-color: #021E44;
}

.phthalo-blue {
  background-color: #0C0040;
}
.phthalo-blue-text {
  color: #0C0040;
}
.phthalo-blue-border {
  border-color: #0C0040;
}

.phthalo-green {
  background-color: #102E3C;
}
.phthalo-green-text {
  color: #102E3C;
}
.phthalo-green-border {
  border-color: #102E3C;
}

.cadmium-yellow {
  background-color: #FFEC00;
}
.cadmium-yellow-text {
  color: #FFEC00;
}
.cadmium-yellow-border {
  border-color: #FFEC00;
}

.yellow-ochre {
  background-color: #C79B00;
}
.yellow-ochre-text {
  color: #C79B00;
}
.yellow-ochre-border {
  border-color: #C79B00;
}

.indian-yellow {
  background-color: #FFB800;
}
.indian-yellow-text {
  color: #FFB800;
}
.indian-yellow-border {
  border-color: #FFB800;
}

.bright-red {
  background-color: #DB0000;
}
.bright-red-text {
  color: #DB0000;
}
.bright-red-border {
  border-color: #DB0000;
}

.titanium-white {
  background-color: #FFFFFF;
}
.titanium-white-text {
  color: #FFFFFF;
}
.titanium-white-border {
  border-color: #FFFFFF;
}

Backlinks

2015

Added to vault 2024-01-15. Updated on 2024-01-26