Docs
Open Lodol
DocumentationIntegrationsAPI

CSS Colors

App · Images & Design · 8 actions

Look up the 148 named CSS colours from the CSS Colors API, the free keyless reference to the colour names every browser understands. Get a colour's hex, rgb() and hsl() forms by name, list a group such as the blues or the greys, list the light or the dark ones so text stays readable, search the names for a word, find the named colour nearest to any hex so a brand value gets a name, or pick one at random for a swatch of the day.

Actions

ActionWhat it does
Check service statusCheck whether the CSS Colors API is answering, and how quickly.
Find the nearest CSS colourFind the named CSS colour closest to any colour value: a hex such as #1E90FE, a short hex such as #19F, or channels such as rgb(30, 144, 254).
Get a CSS colourLook up one CSS colour by name and get its hex, rgb() and hsl() forms and the group and theme the service files it under.
Get a random CSS colourPick one CSS colour at random, from the whole table or from one group or theme, for a placeholder, a swatch of the day or a themed post.
List CSS coloursList every named CSS colour, all 148, with the hex, rgb() and hsl() forms of each and the group and theme the service files it under.
List CSS colours by themeList the colours the service classes as light or as dark.
List CSS colours in a groupList the colours in one of the eleven groups the service sorts the table into: aqua, blue, brown, cyan, gray, green, orange, pink, purple, red and yellow.
Search CSS coloursFind the CSS colours whose name contains a word, best match first: a name that is the word, then names that start with it, then names that merely contain it, so a search for blue leads with Blue and BlueViolet before AliceBlue.

Check service status

Check whether the CSS Colors API is answering, and how quickly. This is the one action that reports a problem as a value instead of failing the step, so a workflow can decide what to do about it. Being reachable but not serving colours is reported separately from being down.

Inputs

None.

Outputs

messagetext
onlinetrue/false
reachabletrue/false
response_time_msnumber
status_codenumber
Example output
{
  "message": "The CSS Colors API is up and answering.",
  "online": true,
  "reachable": true,
  "response_time_ms": 61.8,
  "status_code": 200
}

Find the nearest CSS colour

Find the named CSS colour closest to any colour value: a hex such as #1E90FE, a short hex such as #19F, or channels such as rgb(30, 144, 254). The service has no lookup by value, so the table is read once and every colour measured against the value, weighted the way the eye weights the channels. An exact match is reported as one, names that share the value (Aqua and Cyan, Gray and Grey) come back as aliases, and the next nearest colours are listed with their distances so a step that wants a choice has one.

Inputs

Colour valuecolortextRequired
The colour to match, as a hex code with or without the #, a three-digit short hex, or rgb() channels.
Runners-upcandidate_countnumber
How many of the next nearest colours to list beside the answer, from 0 to 10. Defaults to 3.From 0 to 10.

Outputs

aliaseslist
candidate_countnumber
candidateslist
distancenumber
exacttrue/false
hextext
nearestobject
querytext
Example output
{
  "aliases": [],
  "candidate_count": 3,
  "candidates": [
    {
      "aliases": [],
      "blue": 255,
      "distance": 103.4,
      "green": 191,
      "group": "Blue",
      "hex": "#00BFFF",
      "hsl": "hsl(195, 100%, 50%)",
      "hue": 195,
      "lightness": 50,
      "name": "DeepSkyBlue",
      "red": 0,
      "rgb": "rgb(0, 191, 255)",
      "saturation": 100,
      "theme": "light"
    },
    {
      "aliases": [],
      "blue": 225,
      "distance": 105.5,
      "green": 105,
      "group": "Blue",
      "hex": "#4169E1",
      "hsl": "hsl(225, 73%, 57%)",
      "hue": 225,
      "lightness": 57,
      "name": "RoyalBlue",
      "red": 65,
      "rgb": "rgb(65, 105, 225)",
      "saturation": 73,
      "theme": "dark"
    },
    {
      "aliases": [],
      "blue": 237,
      "distance": 109.3,
      "green": 149,
      "group": "Blue",
      "hex": "#6495ED",
      "hsl": "hsl(219, 79%, 66%)",
      "hue": 219,
      "lightness": 66,
      "name": "CornflowerBlue",
      "red": 100,
      "rgb": "rgb(100, 149, 237)",
      "saturation": 79,
      "theme": "light"
    }
  ],
  "distance": 1.7,
  "exact": false,
  "hex": "#1E90FE",
  "nearest": {
    "blue": 255,
    "green": 144,
    "group": "Blue",
    "hex": "#1E90FF",
    "hsl": "hsl(210, 100%, 56%)",
    "hue": 210,
    "lightness": 56,
    "name": "DodgerBlue",
    "red": 30,
    "rgb": "rgb(30, 144, 255)",
    "saturation": 100,
    "theme": "light"
  },
  "query": "#1e90fe"
}

Get a CSS colour

Look up one CSS colour by name and get its hex, rgb() and hsl() forms and the group and theme the service files it under. Pick a name from the list or type one from an earlier step: case, spaces and hyphens do not matter, so dodger blue finds DodgerBlue. An unknown name is reported as such, with a pointer to the search.

Inputs

Colour namenametextRequired
The colour to look up. Pick one from the list, or type a name from an earlier step in any case, with or without spaces.

Outputs

colorobject
requested_nametext
Example output
{
  "color": {
    "blue": 160,
    "green": 158,
    "group": "Cyan",
    "hex": "#5F9EA0",
    "hsl": "hsl(182, 25%, 50%)",
    "hue": 182,
    "lightness": 50,
    "name": "CadetBlue",
    "red": 95,
    "rgb": "rgb(95, 158, 160)",
    "saturation": 25,
    "theme": "light"
  },
  "requested_name": "CadetBlue"
}

Get a random CSS colour

Pick one CSS colour at random, from the whole table or from one group or theme, for a placeholder, a swatch of the day or a themed post. Give a seed to get the same colour every time for that seed: seed with the date and a daily post that retries, or that two people run an hour apart, picks the same colour, while tomorrow picks a different one.

Inputs

Groupgrouptext
Only pick from this group. Leave empty to pick from every group.One of: aqua, blue, brown, cyan, gray, green, orange, pink, purple, red, yellow.
Themethemetext
Only pick a light or only a dark colour. Leave empty for either. The theme is the service's own classification of which text reads on the colour as a background: black on a light one, white on a dark one.One of: light, dark.
Seedseedtext
Any text you like. The same seed always picks the same colour, so a date gives a colour of the day and a team name gives each team its own. Leave empty for a fresh pick every time.

Outputs

colorobject
grouptext
pool_sizenumber
seedtext
themetext
Example output
{
  "color": {
    "blue": 107,
    "green": 183,
    "group": "Yellow",
    "hex": "#BDB76B",
    "hsl": "hsl(56, 38%, 58%)",
    "hue": 56,
    "lightness": 58,
    "name": "DarkKhaki",
    "red": 189,
    "rgb": "rgb(189, 183, 107)",
    "saturation": 38,
    "theme": "light"
  },
  "group": null,
  "pool_size": 148,
  "seed": "2026-09-11",
  "theme": null
}

List CSS colours

List every named CSS colour, all 148, with the hex, rgb() and hsl() forms of each and the group and theme the service files it under. Sort by name, by hue to walk the spectrum, or by lightness to run dark to light, and cap the count to take the first few: the ten lightest is a sort by lightness and a limit of ten.

Inputs

Sort bysort_bytext
The order the colours come back in. Name is the service's own alphabetical order. Hue walks the spectrum from red through yellow, green, blue and violet, with the greys at the end. Lightness runs dark to light. Defaults to name.One of: name, hue, lightness. Default: name.
Number of colourslimitnumber
How many colours to return, from 1 to 200, taken from the front of the sorted list. Leave empty for all of them: the whole table is only 148.From 1 to 200.

Outputs

color_countnumber
colorslist
requested_countnumber
sort_bytext
totalnumber
Example output
{
  "color_count": 3,
  "colors": [
    {
      "blue": 255,
      "green": 248,
      "group": "Gray",
      "hex": "#F0F8FF",
      "hsl": "hsl(208, 100%, 97%)",
      "hue": 208,
      "lightness": 97,
      "name": "AliceBlue",
      "red": 240,
      "rgb": "rgb(240, 248, 255)",
      "saturation": 100,
      "theme": "light"
    },
    {
      "blue": 215,
      "green": 235,
      "group": "Gray",
      "hex": "#FAEBD7",
      "hsl": "hsl(34, 78%, 91%)",
      "hue": 34,
      "lightness": 91,
      "name": "AntiqueWhite",
      "red": 250,
      "rgb": "rgb(250, 235, 215)",
      "saturation": 78,
      "theme": "light"
    },
    {
      "blue": 255,
      "green": 255,
      "group": "Aqua",
      "hex": "#00FFFF",
      "hsl": "hsl(180, 100%, 50%)",
      "hue": 180,
      "lightness": 50,
      "name": "Aqua",
      "red": 0,
      "rgb": "rgb(0, 255, 255)",
      "saturation": 100,
      "theme": "light"
    }
  ],
  "requested_count": 3,
  "sort_by": "name",
  "total": 148
}

List CSS colours by theme

List the colours the service classes as light or as dark. The theme is the service's own classification of which text reads on the colour as a background: black on a light one, white on a dark one. 53 are dark and 95 light. Sort them and cap the count; the number in the theme is always reported, however many are returned.

Inputs

ThemethemetextRequired
The theme to list. A theme read off an earlier colour works too, in any case.One of: light, dark.
Sort bysort_bytext
The order the colours come back in. Name is the service's own alphabetical order. Hue walks the spectrum from red through yellow, green, blue and violet, with the greys at the end. Lightness runs dark to light. Defaults to name.One of: name, hue, lightness. Default: name.
Number of colourslimitnumber
How many colours to return, from 1 to 200, taken from the front of the sorted list. Leave empty for all of them: the whole table is only 148.From 1 to 200.

Outputs

color_countnumber
colorslist
requested_countnumber
sort_bytext
themetext
total_matchesnumber
Example output
{
  "color_count": 2,
  "colors": [
    {
      "blue": 0,
      "green": 0,
      "group": "Gray",
      "hex": "#000000",
      "hsl": "hsl(0, 0%, 0%)",
      "hue": 0,
      "lightness": 0,
      "name": "Black",
      "red": 0,
      "rgb": "rgb(0, 0, 0)",
      "saturation": 0,
      "theme": "dark"
    },
    {
      "blue": 255,
      "green": 0,
      "group": "Blue",
      "hex": "#0000FF",
      "hsl": "hsl(240, 100%, 50%)",
      "hue": 240,
      "lightness": 50,
      "name": "Blue",
      "red": 0,
      "rgb": "rgb(0, 0, 255)",
      "saturation": 100,
      "theme": "dark"
    }
  ],
  "requested_count": 2,
  "sort_by": "name",
  "theme": "dark",
  "total_matches": 53
}

List CSS colours in a group

List the colours in one of the eleven groups the service sorts the table into: aqua, blue, brown, cyan, gray, green, orange, pink, purple, red and yellow. Keep only the light or only the dark ones, sort them, and cap the count. The number in the group that matched is always reported, however many are returned.

Inputs

GroupgrouptextRequired
The group to list. A group name read off an earlier colour works too, in any case; grey is read as gray.One of: aqua, blue, brown, cyan, gray, green, orange, pink, purple, red, yellow.
Themethemetext
Keep only the light or only the dark colours in the group. Leave empty for both. The theme is the service's own classification of which text reads on the colour as a background: black on a light one, white on a dark one.One of: light, dark.
Sort bysort_bytext
The order the colours come back in. Name is the service's own alphabetical order. Hue walks the spectrum from red through yellow, green, blue and violet, with the greys at the end. Lightness runs dark to light. Defaults to name.One of: name, hue, lightness. Default: name.
Number of colourslimitnumber
How many colours to return, from 1 to 200, taken from the front of the sorted list. Leave empty for all of them: the whole table is only 148.From 1 to 200.

Outputs

color_countnumber
colorslist
grouptext
requested_countnumber
sort_bytext
themetext
total_matchesnumber
Example output
{
  "color_count": 3,
  "colors": [
    {
      "blue": 237,
      "green": 149,
      "group": "Blue",
      "hex": "#6495ED",
      "hsl": "hsl(219, 79%, 66%)",
      "hue": 219,
      "lightness": 66,
      "name": "CornflowerBlue",
      "red": 100,
      "rgb": "rgb(100, 149, 237)",
      "saturation": 79,
      "theme": "light"
    },
    {
      "blue": 255,
      "green": 191,
      "group": "Blue",
      "hex": "#00BFFF",
      "hsl": "hsl(195, 100%, 50%)",
      "hue": 195,
      "lightness": 50,
      "name": "DeepSkyBlue",
      "red": 0,
      "rgb": "rgb(0, 191, 255)",
      "saturation": 100,
      "theme": "light"
    },
    {
      "blue": 255,
      "green": 144,
      "group": "Blue",
      "hex": "#1E90FF",
      "hsl": "hsl(210, 100%, 56%)",
      "hue": 210,
      "lightness": 56,
      "name": "DodgerBlue",
      "red": 30,
      "rgb": "rgb(30, 144, 255)",
      "saturation": 100,
      "theme": "light"
    }
  ],
  "group": "blue",
  "requested_count": 3,
  "sort_by": "name",
  "theme": "light",
  "total_matches": 8
}

Search CSS colours

Find the CSS colours whose name contains a word, best match first: a name that is the word, then names that start with it, then names that merely contain it, so a search for blue leads with Blue and BlueViolet before AliceBlue. Spaces and case are ignored, so sky blue finds SkyBlue. The service has no search of its own, so the table is read once and matched here, and the total number of matches is always reported.

Inputs

Search forquerytextRequired
The word to look for in the colour names, 2 to 60 characters.
Number of colourslimitnumber
How many colours to return, from 1 to 200, taken from the front of the sorted list. Leave empty for all of them: the whole table is only 148.From 1 to 200.

Outputs

match_countnumber
matcheslist
querytext
requested_countnumber
searched_countnumber
total_matchesnumber
Example output
{
  "match_count": 1,
  "matches": [
    {
      "blue": 255,
      "green": 144,
      "group": "Blue",
      "hex": "#1E90FF",
      "hsl": "hsl(210, 100%, 56%)",
      "hue": 210,
      "lightness": 56,
      "name": "DodgerBlue",
      "red": 30,
      "rgb": "rgb(30, 144, 255)",
      "saturation": 100,
      "theme": "light"
    }
  ],
  "query": "dodger",
  "requested_count": null,
  "searched_count": 148,
  "total_matches": 1
}

Crossref

Previous Page

Customer.io

Next Page

On this page

ActionsCheck service statusFind the nearest CSS colourGet a CSS colourGet a random CSS colourList CSS coloursList CSS colours by themeList CSS colours in a groupSearch CSS colours