2b:null 2c:["$","title",null,{"children":"Relative Perception of Color | Otávio Vasques | Observable"}] 31:[] 2f:{"id":"7d29b770ef43305c","slug":"relative-perception-of-color","title":"Relative Perception of Color","thumbnail":"692669967cda351ec7aacf9d66fdce0b4f8c52818caa485ba5bb952c431abf5c","access_level":"public","create_time":"$D2020-04-25T21:59:51.820Z","update_time":"$D2020-05-18T01:12:44.749Z","view_time":null,"first_public_time":"$D2020-04-25T23:26:39.440Z","fork":false,"stars":4,"starred":false,"owner":{"type":"team","id":"5e8d11e509318570","login":"otaviocv","name":"Otávio Vasques","avatar_url":"https://avatars-next.observableusercontent.com/21aa1d096ad0538e8d296d94b9560d33bcd6c2c7a3046310d200f7467de1e103","tier":"starter_2024"},"version":218,"publish_version":218,"role":null,"authored":false,"authors":[{"type":"individual","id":"67f6bc0db63009d0","login":"otaviocv","name":"Otávio Vasques","avatar_url":"https://avatars-next.observableusercontent.com/21aa1d096ad0538e8d296d94b9560d33bcd6c2c7a3046310d200f7467de1e103","tier":null}],"members":[{"type":"individual","id":"67f6bc0db63009d0","login":"otaviocv","name":"Otávio Vasques","avatar_url":"https://avatars-next.observableusercontent.com/21aa1d096ad0538e8d296d94b9560d33bcd6c2c7a3046310d200f7467de1e103","tier":null,"role":"editor"}],"comments":[],"custom_thumbnail":false,"trashed":false,"lapsed":null,"subscribed":null,"forks":2,"collection":{"id":"402200e67e7a4100","slug":"interaction-of-color","title":"Interaction of Color","owner":{"id":"5e8d11e509318570","login":"otaviocv","name":"Otávio Vasques"}},"type":"notebook","body":{"title":"Relative Perception of Color","cells":[{"id":0,"value":"md`# Relative Perception of Color\n***[Interaction of Color IV. Josef Albers](https://yalebooks.yale.edu/book/9780300179354/interaction-color)***\n\n## Exercise\n\nThis is an exercise proposed by Josef Albers in the Interaction of Color book. The purpose of this exercise is to show the relationship of color with its environment, that no color can be perceived alone. The goal in the exercise is to choose three colors, one for each side and a single color for both inner rectangles, so the rectangles look different on each side. It is an exercise to play with the light effects and start an intuition on how the relationship of colors can affect its perception.`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":21,"value":"svg``","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":59,"value":"viewof baseColor = colorpicker({label: html` Rectangle Color`, value: \"#00A313\"})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":77,"value":"viewof lightColor = colorpicker({label: html` Left Color`, value: \"#0E116F\"})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":80,"value":"viewof darkColor = colorpicker({label: html` Right Color`, value: \"#5AFF4D\"})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":28,"value":"md`---\n## Apendix`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":148,"value":"height = Math.floor(width*0.8)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":54,"value":"colorpicker = ({label = '', value = false} = {}) => {\n let wrapper = html``\n let check = html``\n wrapper.append(check)\n wrapper.append(label || '')\n \n check.value = value\n \n check.addEventListener('change', (e) => {\n wrapper.value = check.value\n wrapper.dispatchEvent(new CustomEvent('input'))\n })\n \n // we need to have a starting value\n wrapper.value = check.value\n \n return wrapper\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"}],"files":"$W31","stdlib":"1","titling":"auto"}} 30:"$2f:body"