Developed by Helios, this extension allows you to convert #HEX colours to (R G B) and vice versa. It also allows you to lighten, darken and mix colours.

Overview

http://community.thunkable.com/uploads/default/original/2X/e/e754019115c3749479777af7a952fbf347e06927.aix

Thunkable Community

If you have any questions about the Colours Extension then head on over to the Thunkable Community where you’ll find lots of amazing people who are happy to help you out.

Installation

You can either follow all the steps as shown in the animation below or you can add the starter project directly to your thunkable by clicking here.

HexToRGB

The Colours1.HexToRGB block takes a #HEX colour and converts it into a lisp list in the format (R G B).

Note that you must include the # symbol otherwise the missing character will generate a runtime error such as length=6; regionStart=5; regionLength=2

RGBToHEX

The Colours1.RGBToHex block takes a lisp list and converts it to a #HEX format number.

Lighten & Darken

Both the lighten and darken blocks require two input aruments. The colour input expects a list in the form (R G B), rather than an integer as an input. The amount input expects an input anywhere between 0 and 1.

The lighten and darken blocks return a (R G B) list, so if you want to apply this as a text or background colour somewhere in your app make sure you pass it through a make color block, which you can find in the colours category of blocks, but you have to remove the make a list block first.

Here are two basic examples of using the lighten and darken procedures.

Mix Colours

In keeping with the previous blocks, the inputs for this block, ColourA and ColourB are (R G B) lists, and the amount argument accepts a number anywhere between 0 and 1.

The example below shows how use either a default colour or a custom colour as an input and mix them together.

Again, the return type from this block is a (R G B) list so don’t forget to pass it through a make color block if you want to use it to assign a colour to a component in your design.

Download

The full extension can be dowloaded from the Thunkable community, along with Helios’ documentation and sample app.