# CSS Colors

> 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.

App · Images & Design · 8 actions. Web page: https://docs.lodol.com/docs/integrations/css-colors

## Actions

### 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**

- `message` (text)
- `online` (true/false)
- `reachable` (true/false)
- `response_time_ms` (number)
- `status_code` (number)

**Example output**

```json
{
  "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 value (`color`, text, required): The colour to match, as a hex code with or without the #, a three-digit short hex, or rgb() channels.
- Runners-up (`candidate_count`, number): How many of the next nearest colours to list beside the answer, from 0 to 10. Defaults to 3. From 0 to 10.

**Outputs**

- `aliases` (list)
- `candidate_count` (number)
- `candidates` (list)
- `distance` (number)
- `exact` (true/false)
- `hex` (text)
- `nearest` (object)
- `query` (text)

**Example output**

```json
{
  "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 name (`name`, text, required): 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**

- `color` (object)
- `requested_name` (text)

**Example output**

```json
{
  "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**

- Group (`group`, text): 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`.
- Theme (`theme`, text): 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`.
- Seed (`seed`, text): 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**

- `color` (object)
- `group` (text)
- `pool_size` (number)
- `seed` (text)
- `theme` (text)

**Example output**

```json
{
  "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 by (`sort_by`, text): 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 colours (`limit`, number): 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_count` (number)
- `colors` (list)
- `requested_count` (number)
- `sort_by` (text)
- `total` (number)

**Example output**

```json
{
  "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**

- Theme (`theme`, text, required): The theme to list. A theme read off an earlier colour works too, in any case. One of: `light`, `dark`.
- Sort by (`sort_by`, text): 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 colours (`limit`, number): 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_count` (number)
- `colors` (list)
- `requested_count` (number)
- `sort_by` (text)
- `theme` (text)
- `total_matches` (number)

**Example output**

```json
{
  "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**

- Group (`group`, text, required): 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`.
- Theme (`theme`, text): 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 by (`sort_by`, text): 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 colours (`limit`, number): 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_count` (number)
- `colors` (list)
- `group` (text)
- `requested_count` (number)
- `sort_by` (text)
- `theme` (text)
- `total_matches` (number)

**Example output**

```json
{
  "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 for (`query`, text, required): The word to look for in the colour names, 2 to 60 characters.
- Number of colours (`limit`, number): 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_count` (number)
- `matches` (list)
- `query` (text)
- `requested_count` (number)
- `searched_count` (number)
- `total_matches` (number)

**Example output**

```json
{
  "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
}
```