curriculum/challenges/english/blocks/basic-css/bad82fee1348bd9aedf08721.md
Just like with hex code, you can mix colors in RGB by using combinations of different values.
Replace the hex codes in our style element with their correct RGB values.
Your h1 element with the text I am red! should have the color red.
const redText = document.querySelector('.red-text');
const color = window.getComputedStyle(redText)['color'];
assert.strictEqual(color, 'rgb(255, 0, 0)');
You should use rgb for the color red.
assert.match(code, /\.red-text\s*{\s*color\s*:\s*rgb\(\s*255\s*,\s*0\s*,\s*0\s*\)\s*;?\s*}/gi);
Your h1 element with the text I am orchid! should have the color orchid.
const orchidText = document.querySelector('.orchid-text');
const color = window.getComputedStyle(orchidText)['color'];
assert.strictEqual(color, 'rgb(218, 112, 214)');
You should use rgb for the color orchid.
assert.match(__helpers.removeCssComments(code), /\.orchid-text\s*{\s*color\s*:\s*rgb\(\s*218\s*,\s*112\s*,\s*214\s*\)\s*;?\s*}/gi);
Your h1 element with the text I am blue! should have the color blue.
const blueText = document.querySelector('.blue-text');
const color = window.getComputedStyle(blueText)['color'];
assert.strictEqual(color, 'rgb(0, 0, 255)');
You should use rgb for the color blue.
assert.match(__helpers.removeCssComments(code), /\.blue-text\s*{\s*color\s*:\s*rgb\(\s*0\s*,\s*0\s*,\s*255\s*\)\s*;?\s*}/gi);
Your h1 element with the text I am sienna! should have the color sienna.
const siennaText = document.querySelector('.sienna-text');
const color = window.getComputedStyle(siennaText)['color'];
assert.strictEqual(color, 'rgb(160, 82, 45)');
You should use rgb for the color sienna.
assert.match(__helpers.removeCssComments(code), /\.sienna-text\s*{\s*color\s*:\s*rgb\(\s*160\s*,\s*82\s*,\s*45\s*\)\s*;?\s*}/gi);
<style>
.red-text {
color: #000000;
}
.orchid-text {
color: #000000;
}
.sienna-text {
color: #000000;
}
.blue-text {
color: #000000;
}
</style>
<h1 class="red-text">I am red!</h1>
<h1 class="orchid-text">I am orchid!</h1>
<h1 class="sienna-text">I am sienna!</h1>
<h1 class="blue-text">I am blue!</h1>
<style>
.red-text {
color: rgb(255, 0, 0);
}
.orchid-text {
color: rgb(218, 112, 214);
}
.sienna-text {
color: rgb(160, 82, 45);
}
.blue-text {
color:rgb(0, 0, 255);
}
</style>
<h1 class="red-text">I am red!</h1>
<h1 class="orchid-text">I am orchid!</h1>
<h1 class="sienna-text">I am sienna!</h1>
<h1 class="blue-text">I am blue!</h1>