코딩캠프 CSS기초. Use Abbreviated Hex Code

 

 

https://www.freecodecamp.org/learn/responsive-web-design/basic-css/use-abbreviated-hex-code

 

 

Use Abbreviated Hex Code

Many people feel overwhelmed by the possibilities of more than 16 million colors. And it's difficult to remember hex code. Fortunately, you can shorten it.

For example, red's hex code #FF0000 can be shortened to #F00. This shortened form gives one digit for red, one digit for green, and one digit for blue.

This reduces the total number of possible colors to around 4,000. But browsers will interpret #FF0000 and #F00 as exactly the same color.

 

 

TEST

Go ahead, try using the abbreviated hex codes to color the correct elements.

ColorShort Hex Code

Cyan	#0FF
Green	#0F0
Red	#F00
Fuchsia	#F0F

 

 

<style>
  .red-text {
    color: #F00;
  }
  .fuchsia-text {
    color: #F0F;
  }
  .cyan-text {
    color: #0FF;
  }
  .green-text {
    color: #0F0;
  }
</style>

<h1 class="red-text">I am red!</h1>

<h1 class="fuchsia-text">I am fuchsia!</h1>

<h1 class="cyan-text">I am cyan!</h1>

<h1 class="green-text">I am green!</h1>