BBC micro:bit – RGB Gradient

In this challenge we will use the BBC micro:bit to control a RGB LED to create a gradient light effect where the LED will fade from red to purple, to blue, to purple and back to red.

gradient-red-blue-red

To do so we will need:

  • A BBC micro:bit
  • A RGB LED
  • 3 resistors (100 Ohms)
  • A breadboard
  • 4 wires

RGB Colour Codes


Did you know that every colour on the screen can be represented using an RGB code (Red, Green, Blue) code. This code consists of three numbers between 0 and 255, indicating how much red, green and blue are used to recreate the colour.

For instance the RGB code for:

  • Red is (255,0,0)
  • Green is (0,255,0)
  • Blue is (0,0,255)
  • Yellow is (255,255,0)
  • Orange is (255,165,0)

Check the following RGB Color picker to see how RGB codes work:

Electric Circuit


An RGB LED is a 3-in-1 LED. It consists of a RED LED, a Green LED and a Blue LED all within the same component. It has 3 cathodes (+ pins) that can take different amperages. It has 1 common anode (- pin).
RGB-LED
This is how we will connect our RGB LED to our micro:bit.
bbc-microbit-RGB-LED-Circuit-Gradient
The purpose of the resistors is to limit the amperage in the circuit and hence protect the LED from receiving a too strong current (which could damage the LED). The resistors we use here are 100 ohms (Brown Black Brown rings).

micro:bit Code


Here is the code needed in the micro:bit to implement the gradient fading effect:

Step 1: Initial RGB values
Step 2: Red to Blue Gradient
Step 3: Blue to Red Gradient

Your Challenge


Tweak this code to create other gradient animations:
Gradient 1: Cyan, Magenta, Cyan
gradient-cyan-magenta-cyan
Gradient 2: Cyan, Yellow, Cyan
gradient-cyan-yellow-cyan
Gradient 3: Green, Yellow, Magenta, Cyan, Green
gradient-green-yellow-magenta-cyan-green

Share Button
Posted in BBC micro:bit, Computer Science Tagged with:
One comment on “BBC micro:bit – RGB Gradient
  1. marie-anne says:

    That’s a really cool and simple project! Thank you!

    However the example code does not correspond to diagram. for the “analog write” command you need to have:

    GreenPin -> P0
    BluePin -> P1
    RedPin ->P2

    In order to match the drawing.