freeCodeCamp/curriculum/challenges/ukrainian/01-responsive-web-design/basic-css/use-abbreviated-hex-code.md

id, title, challengeType, videoUrl, forumTopicId, dashedName

id	title	challengeType	videoUrl	forumTopicId	dashedName
bad87fee1348bd9aedf08719	Використання скороченого hex-коду	0	https://scrimba.com/c/cRkpKAm	18338	use-abbreviated-hex-code

--description--

Багато людей відчувають себе перевантаженими можливостями маючи більш ніж 16 мільйонів кольорів. А запам'ятати шістнадцятковий код дуже складно. На щастя, його можна скоротити.

Наприклад, шістнадцятковий код червоного кольору #FF0000 можна скоротити до #F00. Ця скорочена форма дає одну цифру для червоного, одну цифру для зеленого і одну цифру для синього кольору.

Це зменшує загальну кількість можливих кольорів приблизно до 4000. Але браузери будуть інтерпретувати #FF0000 і #F00 як один і той же колір.

--instructions--

Спробуйте використовувати скорочені шіснадцяткові коди, що зафарбувати потрібні елементи.

Колір	Короткий hex-код
Блакитний	#0FF
Зелений	#0F0
Червоний	#F00
Фуксія	#F0F

--hints--

Ваш h1 елемент з текстом I am red! має демонструватися color червоним кольором.

assert($('.red-text').css('color') === 'rgb(255, 0, 0)');

Замість hex code для червоного кольору слід використовувати абревіатуру hex коду #FF0000.

assert(code.match(/\.red-text\s*?{\s*?color\s*:\s*?#F00\s*?;?\s*?}/gi));

Ваш h1 елемент з текстом I am green! має демонструватися color зеленим кольором.

assert($('.green-text').css('color') === 'rgb(0, 255, 0)');

Замість hex code для зеленого кольору слід використовувати абревіатуру hex коду #00FF00.

assert(code.match(/\.green-text\s*?{\s*?color\s*:\s*?#0F0\s*?;?\s*?}/gi));

Ваш h1 елемент з текстом I am cyan! має демонструватися color блакитним кольором.

assert($('.cyan-text').css('color') === 'rgb(0, 255, 255)');

Замість hex code для блакитного кольору слід використовувати абревіатуру hex коду #00FFFF.

assert(code.match(/\.cyan-text\s*?{\s*?color\s*:\s*?#0FF\s*?;?\s*?}/gi));

Ваш h1 елемент з текстом I am fuchsia! має демонструватися color кольором фуксія.

assert($('.fuchsia-text').css('color') === 'rgb(255, 0, 255)');

Замість hex code для кольору фуксії слід використовувати абревіатуру hex коду #FF00FF.

assert(code.match(/\.fuchsia-text\s*?{\s*?color\s*:\s*?#F0F\s*?;?\s*?}/gi));

--seed--

--seed-contents--

<style>
  .red-text {
    color: #000000;
  }
  .fuchsia-text {
    color: #000000;
  }
  .cyan-text {
    color: #000000;
  }
  .green-text {
    color: #000000;
  }
</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>

--solutions--

<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>