Colour Previewer

Instructions

A common problem in design is working out which colours compliment each other. Does blue text work on a white background? What about red text?

This gadget tests foreground colours against background colours. Simply enter a colour code into one or both of the text boxes and press TAB, and you'll see the colours in the PREVIEW box change accordingly.

The gadget should work with pretty much any form of colour coding.

HTML Colour Names

Write the name of the colour in the box.

Permitted colour names are: aqua, black, blue, fuchsia, green, gray, lime, maroon, navy, olive, purple, red, silver, teal, white, yellow.

Example: teal

X11 Colour Names

As above, but with a wider range of colour names. See Wikipedia for a complete list and examples.

Example: PapayaWhip

Hex Codes

Remember to put an octothorpe (#) before the code.

Example: #FF00FF

Three-digit Hex Codes

As above.

Example: #F0F

RGB Codes

Put your RGB values in brackets, separated by commas. Place the prefix rgb before the brackets. Each value should be between 0 and 255.

Example: rgb(255,0,255)

RGBA Codes

Put your RGBA values in brackets, separated by commas. Place the prefix rgba before the brackets. Each RGB value should be between 0 and 255, while the alpha value should be between 0 and 1.

Example: rgba(255,0,255,0.5)