Home › Colors & Design › Color Picker / HEX ↔ RGB
🎨

Color Picker / HEX ↔ RGB Converter

Pick any colour and instantly convert between HEX, RGB and HSL — with the full Toolify brand palette as one-click swatches.

📖 How to use this tool

  1. Click the colour wheel to open your browser's native colour picker and choose any colour.
  2. Or type a HEX code (e.g. #6C63FF) directly into the HEX field and press Enter.
  3. Click any brand colour swatch below to load a Toolify palette colour instantly.
  4. Copy the HEX, RGB or HSL value with the Copy button on each row.
Pick a colour or choose a swatch below
HEX
RGB
HSL
CSS
🎨 Toolify Brand Palette
BACKGROUNDS & SURFACES
TEXT COLOURS
ACCENT COLOURS
CATEGORY COLOURS

Frequently Asked Questions

A HEX colour code is a six-digit hexadecimal number (e.g. #6C63FF) used in HTML and CSS to specify colours. The first two digits represent red, the next two green, and the last two blue — each on a scale of 00 to FF (0–255).
RGB defines a colour by the intensity of its red, green and blue channels (0–255 each). HSL (Hue, Saturation, Lightness) is often more intuitive for designers — hue is the colour angle (0–360°), saturation is the vividness (0–100%), and lightness controls how dark or light it is (0–100%).
Yes — click into the HEX field, type your code (with or without the # prefix) and press Enter. The colour picker and all other format fields will update automatically.
Toolify uses a dark theme built on a deep navy background (#0F1117), a purple primary accent (#6C63FF), a teal secondary accent (#00D4AA), and a soft white foreground (#F0F4FF). Each of the ten tool categories also has its own accent colour used for icons and headings throughout the site.