{"id":355,"date":"2006-01-23T23:10:43","date_gmt":"2006-01-23T23:10:43","guid":{"rendered":"http:\/\/www.little.org\/blog\/2006\/01\/23\/AGreatSiteForTheColorBlindWebDeveloper.aspx"},"modified":"2006-01-23T23:10:43","modified_gmt":"2006-01-23T23:10:43","slug":"a-great-site-for-the-color-blind-web-developer","status":"publish","type":"post","link":"https:\/\/www.little.org\/blog\/2006\/01\/23\/a-great-site-for-the-color-blind-web-developer\/","title":{"rendered":"A great site for the color blind web developer"},"content":{"rendered":"<p><P>I&#8217;ve built my share of web pages.&nbsp; I can do the layout.&nbsp; I can do the CSS, HTML, etc.&nbsp; I always have problems picking a color scheme.&nbsp; I&#8217;ve now found a site to help me out with that part of the process.<\/P><br \/>\n<P>If you aren&#8217;t a natural at picking colors and\/or were not professionally trained as an artist, you may find getting a set of colors which complement each other is difficult.&nbsp; I usually use a set of colors from a design book or copy a pretty web.&nbsp; If, however, I need a specific color&#8230; I&#8217;m SOL.<\/P><br \/>\n<P>Enter <a href=\"http:\/\/web.archive.org\/web\/20140524023533\/http:\/\/colorblender.com\/\">ColorBlender.com<\/a>.&nbsp; This site is a variation on a tool which has been floating around the net in open source for a while (see &#8220;A little history lesson&#8221; below).&nbsp; What I like about this particular implementation is it has a slick interface combined with the ability to export the color blends as a Photoshop Color Tables (great for all the pixel-pushers out there).<\/P><br \/>\n<P>Here&#8217;s how it works: <\/P><br \/>\n<OL><br \/>\n<LI>Either start with a color in mind our use their blending sliders to construct a color (I decided to go with a nice, bright blue for this run) <BR><IMG alt=\"\" hspace=0 src=\"http:\/\/thelittles.smugmug.com\/photos\/53640660-S.jpg\" align=baseline border=0><br \/>\n<LI>If you like your blend, you&#8217;re done! <BR><IMG alt=\"\" hspace=0 src=\"http:\/\/thelittles.smugmug.com\/photos\/53640661-S.jpg\" align=baseline border=0><br \/>\n<LI>If you&#8217;d like to tweak the blend, click the &#8220;Direct Edit&#8221; radio button then adjust individual colors on your palette using the same sliders from step 1.<BR><IMG alt=\"\" hspace=0 src=\"http:\/\/thelittles.smugmug.com\/photos\/53641711-S-0.jpg\" align=baseline border=0><\/LI><\/OL><br \/>\n<P>That&#8217;s really about it, go forth and create.&nbsp; If you do end up using this on a web site, please let me know, I&#8217;d like to&nbsp;provide a link to your creation from this post so others can see how this tool can be applied to web design.<\/P><br \/>\n<P><br \/>\n<HR><\/p>\n<p><P><\/P><br \/>\n<P><FONT color=#808080 size=1>A little history lesson<\/FONT><\/P><br \/>\n<P><FONT color=#808080 size=1>The original tool was called <A href=\"http:\/\/www.colormatch.dk\/\">ColorMatch 5K<\/A> and was entered by <A href=\"http:\/\/port80.biz\/\">Kim Jensen<\/A> into a 2001 web competition which required the tools submitted be less than 5, 120 bytes.&nbsp; Due to the size requirements, <A href=\"http:\/\/www.colormatch.dk\/\">ColorMatch 5K<\/A> was limited and didn&#8217;t have a ton of cross-browser compatibility, so many sites took up the code and improved upon it.&nbsp; <A href=\"http:\/\/search.msn.com\/results.aspx?q=ColorMatch+5k\">ColorBlender.com<\/A> is my favorite, <A href=\"http:\/\/search.msn.com\/results.aspx?q=ColorMatch+5k\">a quick search could help you to find yours<\/A>. <\/FONT><FONT color=#808080 size=1><BR><\/FONT><\/P><\/p>\n","protected":false},"excerpt":{"rendered":"<p>I&#8217;ve built my share of web pages.&nbsp; I can do the layout.&nbsp; I can do the CSS, HTML, etc.&nbsp; I always have problems picking a color scheme.&nbsp; I&#8217;ve now found a site to help me out with that part of the process. If you aren&#8217;t a natural at picking colors and\/or were not professionally trained [&hellip;]<\/p>\n","protected":false},"author":2,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_jetpack_memberships_contains_paid_content":false,"footnotes":""},"categories":[29,41],"tags":[131],"class_list":["post-355","post","type-post","status-publish","format-standard","hentry","category-webdesign","category-usefulsites","tag-useful-site"],"jetpack_featured_media_url":"","jetpack_sharing_enabled":true,"_links":{"self":[{"href":"https:\/\/www.little.org\/blog\/wp-json\/wp\/v2\/posts\/355","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.little.org\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.little.org\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.little.org\/blog\/wp-json\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/www.little.org\/blog\/wp-json\/wp\/v2\/comments?post=355"}],"version-history":[{"count":0,"href":"https:\/\/www.little.org\/blog\/wp-json\/wp\/v2\/posts\/355\/revisions"}],"wp:attachment":[{"href":"https:\/\/www.little.org\/blog\/wp-json\/wp\/v2\/media?parent=355"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.little.org\/blog\/wp-json\/wp\/v2\/categories?post=355"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.little.org\/blog\/wp-json\/wp\/v2\/tags?post=355"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}