27:null 28:["$","title",null,{"children":"HSL color picker (with hex) | Steve Kasica | Observable"}] 2d:[] 2b:{"id":"0ba6c0ce4bddadcc","slug":null,"title":"HSL color picker (with hex)","thumbnail":"4b6d2192111762a221ddffedf3a599520afa3b49688b9893404a9759035c884e","access_level":"public","create_time":"$D2025-03-01T12:27:22.534Z","update_time":"$D2025-03-01T12:28:30.394Z","view_time":null,"first_public_time":"$D2025-03-01T12:27:22.534Z","has_unpublished_edits":null,"fork":{"id":"5251d80ef666a3e7","slug":"hsl-color-picker","title":"HSL color picker","owner":{"id":"863951e3ebe4c0ae","login":"d3","name":"D3"}},"stars":0,"starred":false,"owner":{"type":"team","id":"1cebfd5d1e47fa9b","login":"stvkas","name":"Steve Kasica","avatar_url":"https://avatars-next.observableusercontent.com/b10311feda71ac109d4c36f5ef7f30ba700e7c0f8160bc5750596e4c28d9e1ab","tier":"starter_2024"},"version":52,"publish_version":null,"role":null,"authored":false,"authors":[{"type":"individual","id":"a483da0cdef190cc","login":"stvkas","name":"Steve Kasica","avatar_url":"https://avatars-next.observableusercontent.com/b10311feda71ac109d4c36f5ef7f30ba700e7c0f8160bc5750596e4c28d9e1ab","tier":null}],"members":[{"type":"team","id":"1cebfd5d1e47fa9b","login":"stvkas","name":"Steve Kasica","avatar_url":"https://avatars-next.observableusercontent.com/b10311feda71ac109d4c36f5ef7f30ba700e7c0f8160bc5750596e4c28d9e1ab","tier":"starter_2024","role":"editor"},{"type":"individual","id":"a483da0cdef190cc","login":"stvkas","name":"Steve Kasica","avatar_url":"https://avatars-next.observableusercontent.com/b10311feda71ac109d4c36f5ef7f30ba700e7c0f8160bc5750596e4c28d9e1ab","tier":null,"role":"editor"}],"comments":[],"custom_thumbnail":false,"trashed":false,"lapsed":null,"subscribed":null,"forks":0,"collection":null,"type":"notebook","body":{"title":"HSL color picker (with hex)","cells":[{"id":0,"value":"# HSL color picker (with hex)\n\nA fork to display hue, saturation, and lightness values from `picker` with the corresponding hexadecimal color value.","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":24,"value":"\n

Hue: ${color.h}
Saturation: ${color.s}
Lightness: ${color.l}
Hex: ${color.hex()}

","pinned":false,"hidden":false,"mode":"html","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":4,"value":"viewof color = picker(\"hsl\", [\n { name: \"h\", domain: [0, 360] },\n { name: \"s\", domain: [0, 1] },\n { name: \"l\", domain: [0, 1] }\n])","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":8,"value":"import {picker} from \"@d3/hcl-color-picker\"","pinned":true,"hidden":true,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"}],"files":"$W2d","stdlib":"1","titling":"auto"}} 2c:"$2b:body"