HTML and CSS · lesson 15 of 30 · free

Colours: hex and rgb — HTML and CSS for kids

Screens make every colour by mixing red, green and blue light. In rgb notation each of the three goes from 0 to 255. In a hex code such as #ff0000 the three pairs of digits are red, green and blue, written in base 16 with digits 0 to 9 and a to f. A pair is worth 16 times its first digit plus its second, so ff is 255 and 00 is 0.

▶ Watch how it works

Got it? Practise ↓

Code tip

Red, green, blue — “every screen colour mixes red, green and blue light from 0 to 255”

  1. rgb(red, green, blue): each from 0 to 255. #rrggbb: the same three numbers in hex.
  2. Hex digits: 0–9, then a = 10, b = 11, c = 12, d = 13, e = 14, f = 15.
  3. A pair = 16 × first digit + second digit: ff = 16 × 15 + 15 = 255.

Use it for: Choosing exact colours for a page and reading colour codes in other people’s CSS.

Worked example: 🌈 In #ff0000 the red part is the hex number ff. What is it as a normal number? → 255

  1. f = 15, so ff = 16 × 15 + 15.
  2. 240 + 15 = 255.

Check: #ff0000 = rgb(255, 0, 0) = full red ✓

▶ Watch it animated

✏️ Practice

Work it out in your head or on paper, type the answer and press Check. Stuck? Press “Show me how”.

Right: 0 · Tried: 0

🏁 Lesson 15 test

20 questions. Check each answer, then go to the next one. Get 16 or more right to pass.

🏅 Sign in with Google to earn the 🌈 Hex Colour Mixer badge when you pass — and a certificate when you finish all 10 lessons of Part 2 · CSS. You can still take the test without signing in.

🖨️ CSS Worksheet: Hex and RGB Colours

✨ Free AI tutor

Ask the AI tutor about this lesson

Why does it work? When should you use it? Ask in English, मराठी or हिंदी.

Sign in with Google to ask Free — 20 questions a day.

👩‍🏫 HTML and CSS classes near you — online or at home

Prefer a real teacher? TalentJR teachers take live online classes anywhere in India and visit homes in selected cities. Tell us what you need and our team will call you with timings and fees.

Live online classesSmall groups or 1:1 with a teacher, from home, any city.
Teacher at homeA TalentJR teacher visits your home (selected cities).
At a centreClasses at a TalentJR partner centre near you, where available.
Badges, certificates & gifts A badge for every lesson you pass, a certificate for every part you finish, plus TalentJR Points for daily practice. Computer worksheets Flowcharts, block coding, spreadsheets and safe internet.