{"id":41,"date":"2022-09-14T21:24:34","date_gmt":"2022-09-14T21:24:34","guid":{"rendered":"http:\/\/localhost\/?p=41"},"modified":"2023-12-06T12:03:22","modified_gmt":"2023-12-06T12:03:22","slug":"colorshifter","status":"publish","type":"post","link":"http:\/\/bentus\/colorshifter\/","title":{"rendered":"Colorshifter"},"content":{"rendered":"\n<p>Colorshifter is an image manipulation app that for transforming the colorspace of an image in L*a*b* color coordinates. <a href=\"https:\/\/github.com\/trygvrad\/colorshifter\">github<\/a><\/p>\n\n\n\n<!--more-->\n\n\n\n<p>The left\/right image is the original\/transformed image<\/p>\n\n\n\n<p>The histogram allows the user to edit the lightness (L*)<\/p>\n\n\n\n<p>The colormap on the right shows the a*b* plane, with a 2d histogram of the original image as white contour lines, and ditto for the transformed image as black. The shape\/position\/rotation of the rectangle defines how the original colorspace transforms onto the new colorspace.<\/p>\n\n\n\n<p>Because not all colors in the transformed colorspace produce valid colors in RGB space, one may choose to limit the lighness or saturation for colors outside the RGB space.<br>To achieve specific transformations the a*b* plane may be rotated before the transformation occurs (rotating the primary axis of the rectangle)<\/p>\n\n\n\n<p>The program used to edit a real image:<\/p>\n\n\n\n<figure class=\"wp-block-image size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"551\" src=\"http:\/\/localhost\/wp-content\/uploads\/2023\/06\/Example-0-1024x551-1.png\" alt=\"\" class=\"wp-image-42\" srcset=\"http:\/\/bentus\/wp-content\/uploads\/2023\/06\/Example-0-1024x551-1.png 1024w, http:\/\/bentus\/wp-content\/uploads\/2023\/06\/Example-0-1024x551-1-300x161.png 300w, http:\/\/bentus\/wp-content\/uploads\/2023\/06\/Example-0-1024x551-1-768x413.png 768w, http:\/\/bentus\/wp-content\/uploads\/2023\/06\/Example-0-1024x551-1-600x323.png 600w, http:\/\/bentus\/wp-content\/uploads\/2023\/06\/Example-0-1024x551-1-945x508.png 945w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><\/figure>\n\n\n\n<p>Used to recolor for prototyping:<\/p>\n\n\n\n<figure class=\"wp-block-image size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"593\" src=\"http:\/\/localhost\/wp-content\/uploads\/2023\/06\/example-2-1024x593-1.png\" alt=\"\" class=\"wp-image-43\" srcset=\"http:\/\/bentus\/wp-content\/uploads\/2023\/06\/example-2-1024x593-1.png 1024w, http:\/\/bentus\/wp-content\/uploads\/2023\/06\/example-2-1024x593-1-300x174.png 300w, http:\/\/bentus\/wp-content\/uploads\/2023\/06\/example-2-1024x593-1-768x445.png 768w, http:\/\/bentus\/wp-content\/uploads\/2023\/06\/example-2-1024x593-1-600x347.png 600w, http:\/\/bentus\/wp-content\/uploads\/2023\/06\/example-2-1024x593-1-945x547.png 945w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><\/figure>\n\n\n\n<p>Or used to recolor a texture (here also removing blue hues):<\/p>\n\n\n\n<figure class=\"wp-block-image size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"595\" src=\"http:\/\/localhost\/wp-content\/uploads\/2023\/06\/example-1-1-1024x595-1.png\" alt=\"\" class=\"wp-image-44\" srcset=\"http:\/\/bentus\/wp-content\/uploads\/2023\/06\/example-1-1-1024x595-1.png 1024w, http:\/\/bentus\/wp-content\/uploads\/2023\/06\/example-1-1-1024x595-1-300x174.png 300w, http:\/\/bentus\/wp-content\/uploads\/2023\/06\/example-1-1-1024x595-1-768x446.png 768w, http:\/\/bentus\/wp-content\/uploads\/2023\/06\/example-1-1-1024x595-1-600x349.png 600w, http:\/\/bentus\/wp-content\/uploads\/2023\/06\/example-1-1-1024x595-1-945x549.png 945w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><\/figure>\n","protected":false},"excerpt":{"rendered":"<p>Colorshifter is an image manipulation app that for transforming the colorspace of an image in L*a*b* color coordinates. github<\/p>\n","protected":false},"author":1,"featured_media":42,"comment_status":"closed","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[1],"tags":[],"class_list":["post-41","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-uncategorized","clear"],"_links":{"self":[{"href":"http:\/\/bentus\/wp-json\/wp\/v2\/posts\/41"}],"collection":[{"href":"http:\/\/bentus\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"http:\/\/bentus\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"http:\/\/bentus\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"http:\/\/bentus\/wp-json\/wp\/v2\/comments?post=41"}],"version-history":[{"count":3,"href":"http:\/\/bentus\/wp-json\/wp\/v2\/posts\/41\/revisions"}],"predecessor-version":[{"id":102,"href":"http:\/\/bentus\/wp-json\/wp\/v2\/posts\/41\/revisions\/102"}],"wp:featuredmedia":[{"embeddable":true,"href":"http:\/\/bentus\/wp-json\/wp\/v2\/media\/42"}],"wp:attachment":[{"href":"http:\/\/bentus\/wp-json\/wp\/v2\/media?parent=41"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"http:\/\/bentus\/wp-json\/wp\/v2\/categories?post=41"},{"taxonomy":"post_tag","embeddable":true,"href":"http:\/\/bentus\/wp-json\/wp\/v2\/tags?post=41"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}