2d:null 2e:["$","title",null,{"children":"Nearest CSS named colors | Dan Burzo | Observable"}] 33:T677,md`

Euclidean (Oklab)

${ toSwatch(input_color) } ${ culori.nearest(Object.keys(culori.colorsNamed), culori.differenceEuclidean('oklab'))(input_color, 16).map(toInlineSwatch) }

Kotsarenko/Ramos

${ toSwatch(input_color) } ${ culori.nearest(Object.keys(culori.colorsNamed), culori.differenceKotsarenkoRamos())(input_color, 16).map(toInlineSwatch) }

DIN99o

${ toSwatch(input_color) } ${ culori.nearest(colors, culori.differenceEuclidean('dlab'))(input_color, 16).map(toInlineSwatch) }

CIEDE2000

${ toSwatch(input_color) } ${ culori.nearest(colors, culori.differenceCiede2000())(input_color, 16).map(toInlineSwatch) }

CIE94

${ toSwatch(input_color) } ${ culori.nearest(colors, culori.differenceCie94())(input_color, 16).map(toInlineSwatch) }

CIE76

${ toSwatch(input_color) } ${ culori.nearest(colors, culori.differenceCie76())(input_color, 16).map(toInlineSwatch) }

CMC (l:c)

${ toSwatch(input_color) } ${ culori.nearest(colors, culori.differenceCmc())(input_color, 16).map(toInlineSwatch) }

Euclidean (RGB)

${ toSwatch(input_color) } ${ culori.nearest(colors, culori.differenceEuclidean('rgb'))(input_color, 16).map(toInlineSwatch) }

Euclidean (LRGB)

${ toSwatch(input_color) } ${ culori.nearest(colors, culori.differenceEuclidean('lrgb'))(input_color, 16).map(toInlineSwatch) }

Euclidean (LCH)

${ toSwatch(input_color) } ${ culori.nearest(colors, culori.differenceEuclidean('lch'))(input_color, 16).map(toInlineSwatch) }

`34:[] 31:{"id":"74d5d1ff20264210","slug":"nearest-css-named-colors","title":"Nearest CSS named colors","thumbnail":"8b0b60ddaec7177475ec657b0e5019ef1e97a85989015c48510ca6d8805ad050","access_level":"public","create_time":"$D2018-10-18T12:07:23.446Z","update_time":"$D2021-10-04T07:07:02.165Z","view_time":null,"first_public_time":"$D2018-10-18T12:37:01.365Z","has_unpublished_edits":null,"fork":false,"stars":10,"starred":false,"owner":{"type":"team","id":"d2d1bf09f301c5bc","login":"danburzo","name":"Dan Burzo","avatar_url":"https://avatars-next.observableusercontent.com/35c5b738eddc0f17cce4d7d76150fa2d2bb131de4cbd2c6d40541e0abac56af9","tier":"starter_2024"},"version":108,"publish_version":null,"role":null,"authored":false,"authors":[{"type":"individual","id":"0303102bdc18d54b","login":"danburzo","name":"Dan Burzo","avatar_url":"https://avatars-next.observableusercontent.com/35c5b738eddc0f17cce4d7d76150fa2d2bb131de4cbd2c6d40541e0abac56af9","tier":null}],"members":[{"type":"individual","id":"0303102bdc18d54b","login":"danburzo","name":"Dan Burzo","avatar_url":"https://avatars-next.observableusercontent.com/35c5b738eddc0f17cce4d7d76150fa2d2bb131de4cbd2c6d40541e0abac56af9","tier":null,"role":"editor"}],"comments":[],"custom_thumbnail":false,"trashed":false,"lapsed":null,"subscribed":null,"forks":3,"collection":{"id":"496ce6a89b187242","slug":"color-exploration","title":"Color","owner":{"id":"d2d1bf09f301c5bc","login":"danburzo","name":"Dan Burzo"}},"type":"notebook","body":{"title":"Nearest CSS named colors","cells":[{"id":0,"value":"md`\n# Nearest CSS named colors\n\nSelect a color from the picker below and this notebook will show you the nearest CSS named colors — based on various difference formulas implemented in [culori](https://github.com/evercoder/culori) — from more similar (left) to less similar (right).\n`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":10,"value":"viewof input_color = html``","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":12,"value":"$33","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":57,"value":"colors = Object.keys(culori.colorsNamed)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":19,"value":"toSwatch = (c) => \n`

`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":4,"value":"toInlineSwatch = (c) => \n``","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":6,"value":"culori = import('culori')","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"}],"files":"$W34","stdlib":"1","titling":"auto"}} 32:"$31:body"