{"id":6791,"date":"2015-06-26T22:26:09","date_gmt":"2015-06-27T05:26:09","guid":{"rendered":"http:\/\/proxystudio.uxpin.com\/?p=6791"},"modified":"2020-04-22T06:38:34","modified_gmt":"2020-04-22T13:38:34","slug":"free-pocket-guide-color-theory-web-ui-design","status":"publish","type":"post","link":"https:\/\/www.uxpin.com\/studio\/blog\/free-pocket-guide-color-theory-web-ui-design\/","title":{"rendered":"Free pocket guide: Color Theory in Web UI Design"},"content":{"rendered":"<p>You can read everything you need to know about color theory collected into one easy-reference guide.<\/p>\n<p><a href=\"https:\/\/www.uxpin.com\/studio\/ebooks\/color-theory-web-ui-design-practical-principles\/\">Color Theory in Web UI Design<\/a> is available to download now. Let&#8217;s take a peek inside.\u00a0<\/p>\n<p><!--more--><\/p>\n<p>Each color invokes different emotional and psychological responses in users, and the effects are even more powerful as you combine colors. A designer who knows how to apply color theory to web UI design is able to wield a great \u2013 although subtle \u2013 influence over the user\u2019s experience and overall impression.<\/p>\n<p>Illustrating color usage with examples from 24 different sites likes Mozilla, Facebook, Squarespace, and Cadbury, this pocket guide is a crash course on color theory.<\/p>\n<h2><strong>What\u2019s Inside:<\/strong><\/h2>\n<p><a href=\"https:\/\/www.uxpin.com\/studio\/ebooks\/color-theory-web-ui-design-practical-principles\/\"><img loading=\"lazy\" decoding=\"async\" class=\"alignnone size-full wp-image-6792\" src=\"https:\/\/www.uxpin.com\/studio\/wp-content\/uploads\/2015\/06\/Screen-Shot-2015-06-26-at-10.23.32-PM.png\" alt=\"Screen Shot 2015-06-26 at 10.23.32 PM\" width=\"547\" height=\"411\" \/><\/a><\/p>\n<p>Briefly condensing the fundamentals of color theory as they apply to web design, this <a href=\"https:\/\/www.uxpin.com\/studio\/ebooks\/color-theory-web-ui-design-practical-principles\/\">free pocket guide <\/a>will teach you:<\/p>\n<ul>\n<li>The emotional response each of the primary colors creates.<\/li>\n<\/ul>\n<ul>\n<li>How to create the right mood for your site, from a energetic and alert atmosphere to a relaxing and calm one \u2013 and all points in between.<\/li>\n<\/ul>\n<ul>\n<li>Best practices for mixing the right colors together<\/li>\n<\/ul>\n<ul>\n<li>The six most popular color schemes in web design, and the pros and cons of each.<\/li>\n<\/ul>\n<ul>\n<li>Our hand-picked list of the most helpful color resources on the web today.<\/li>\n<\/ul>\n<p><a href=\"https:\/\/www.uxpin.com\/studio\/ebooks\/color-theory-web-ui-design-practical-principles\/\">Download this free ebook now<\/a>.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>You can read everything you need to know about color theory collected into one easy-reference guide. Color Theory in Web UI Design is available to download now. Let&#8217;s take a peek inside.\u00a0<\/p>\n","protected":false},"author":9,"featured_media":6802,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[3,4,6,7],"tags":[],"class_list":["post-6791","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-blog","category-ui-design","category-ux-design","category-web-design"],"yoast_title":"Free UI design e-book: Color Theory in Web UI Design","yoast_metadesc":"A 35-page guide explaining how to use color to affect user mood and experience. 24 examples from companies like Squarespace & Mozilla included.","acf":[],"yoast_head":"<!-- This site is optimized with the Yoast SEO Premium plugin v27.4 (Yoast SEO v27.5) - https:\/\/yoast.com\/product\/yoast-seo-premium-wordpress\/ -->\n<title>Free UI design e-book: Color Theory in Web UI Design<\/title>\n<meta name=\"description\" content=\"A 35-page guide explaining how to use color to affect user mood and experience. 24 examples from companies like Squarespace &amp; Mozilla included.\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/www.uxpin.com\/studio\/blog\/free-pocket-guide-color-theory-web-ui-design\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Free pocket guide: Color Theory in Web UI Design\" \/>\n<meta property=\"og:description\" content=\"A 35-page guide explaining how to use color to affect user mood and experience. 24 examples from companies like Squarespace &amp; Mozilla included.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/www.uxpin.com\/studio\/blog\/free-pocket-guide-color-theory-web-ui-design\/\" \/>\n<meta property=\"og:site_name\" content=\"Studio by UXPin\" \/>\n<meta property=\"article:published_time\" content=\"2015-06-27T05:26:09+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2020-04-22T13:38:34+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/www.uxpin.com\/studio\/wp-content\/uploads\/2015\/06\/blog-book2.png\" \/>\n\t<meta property=\"og:image:width\" content=\"720\" \/>\n\t<meta property=\"og:image:height\" content=\"330\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/png\" \/>\n<meta name=\"author\" content=\"Jerry Cao\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"Jerry Cao\" \/>\n\t<meta name=\"twitter:label2\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data2\" content=\"1 minute\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\\\/\\\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\\\/\\\/www.uxpin.com\\\/studio\\\/blog\\\/free-pocket-guide-color-theory-web-ui-design\\\/#article\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/www.uxpin.com\\\/studio\\\/blog\\\/free-pocket-guide-color-theory-web-ui-design\\\/\"},\"author\":{\"name\":\"Jerry Cao\",\"@id\":\"https:\\\/\\\/www.uxpin.com\\\/studio\\\/#\\\/schema\\\/person\\\/e58da1b4c401eb288436977eb9810a18\"},\"headline\":\"Free pocket guide: Color Theory in Web UI Design\",\"datePublished\":\"2015-06-27T05:26:09+00:00\",\"dateModified\":\"2020-04-22T13:38:34+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\\\/\\\/www.uxpin.com\\\/studio\\\/blog\\\/free-pocket-guide-color-theory-web-ui-design\\\/\"},\"wordCount\":217,\"image\":{\"@id\":\"https:\\\/\\\/www.uxpin.com\\\/studio\\\/blog\\\/free-pocket-guide-color-theory-web-ui-design\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/www.uxpin.com\\\/studio\\\/wp-content\\\/uploads\\\/2015\\\/06\\\/blog-book2.png\",\"articleSection\":[\"Blog\",\"UI Design\",\"UX Design\",\"Web Design\"],\"inLanguage\":\"en-US\"},{\"@type\":\"WebPage\",\"@id\":\"https:\\\/\\\/www.uxpin.com\\\/studio\\\/blog\\\/free-pocket-guide-color-theory-web-ui-design\\\/\",\"url\":\"https:\\\/\\\/www.uxpin.com\\\/studio\\\/blog\\\/free-pocket-guide-color-theory-web-ui-design\\\/\",\"name\":\"Free UI design e-book: Color Theory in Web UI Design\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/www.uxpin.com\\\/studio\\\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\\\/\\\/www.uxpin.com\\\/studio\\\/blog\\\/free-pocket-guide-color-theory-web-ui-design\\\/#primaryimage\"},\"image\":{\"@id\":\"https:\\\/\\\/www.uxpin.com\\\/studio\\\/blog\\\/free-pocket-guide-color-theory-web-ui-design\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/www.uxpin.com\\\/studio\\\/wp-content\\\/uploads\\\/2015\\\/06\\\/blog-book2.png\",\"datePublished\":\"2015-06-27T05:26:09+00:00\",\"dateModified\":\"2020-04-22T13:38:34+00:00\",\"author\":{\"@id\":\"https:\\\/\\\/www.uxpin.com\\\/studio\\\/#\\\/schema\\\/person\\\/e58da1b4c401eb288436977eb9810a18\"},\"description\":\"A 35-page guide explaining how to use color to affect user mood and experience. 24 examples from companies like Squarespace & Mozilla included.\",\"breadcrumb\":{\"@id\":\"https:\\\/\\\/www.uxpin.com\\\/studio\\\/blog\\\/free-pocket-guide-color-theory-web-ui-design\\\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\\\/\\\/www.uxpin.com\\\/studio\\\/blog\\\/free-pocket-guide-color-theory-web-ui-design\\\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\\\/\\\/www.uxpin.com\\\/studio\\\/blog\\\/free-pocket-guide-color-theory-web-ui-design\\\/#primaryimage\",\"url\":\"https:\\\/\\\/www.uxpin.com\\\/studio\\\/wp-content\\\/uploads\\\/2015\\\/06\\\/blog-book2.png\",\"contentUrl\":\"https:\\\/\\\/www.uxpin.com\\\/studio\\\/wp-content\\\/uploads\\\/2015\\\/06\\\/blog-book2.png\",\"width\":720,\"height\":330,\"caption\":\"blog book2\"},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\\\/\\\/www.uxpin.com\\\/studio\\\/blog\\\/free-pocket-guide-color-theory-web-ui-design\\\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\\\/\\\/www.uxpin.com\\\/studio\\\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Free pocket guide: Color Theory in Web UI Design\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\\\/\\\/www.uxpin.com\\\/studio\\\/#website\",\"url\":\"https:\\\/\\\/www.uxpin.com\\\/studio\\\/\",\"name\":\"Studio by UXPin\",\"description\":\"\",\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\\\/\\\/www.uxpin.com\\\/studio\\\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"en-US\"},{\"@type\":\"Person\",\"@id\":\"https:\\\/\\\/www.uxpin.com\\\/studio\\\/#\\\/schema\\\/person\\\/e58da1b4c401eb288436977eb9810a18\",\"name\":\"Jerry Cao\",\"description\":\"Jerry Cao is a content strategist at UXPin where he gets to put his overly active imagination to paper every day. In a past life, he developed content strategies for clients at Brafton and worked in traditional advertising at DDB San Francisco. In his spare time he enjoys playing electric guitar, watching foreign horror films, and expanding his knowledge of random facts. Follow him on Twitter.\",\"sameAs\":[\"http:\\\/\\\/uxpin.com\"],\"url\":\"https:\\\/\\\/www.uxpin.com\\\/studio\\\/author\\\/jerrycao\\\/\"}]}<\/script>\n<!-- \/ Yoast SEO Premium plugin. -->","yoast_head_json":{"title":"Free UI design e-book: Color Theory in Web UI Design","description":"A 35-page guide explaining how to use color to affect user mood and experience. 24 examples from companies like Squarespace & Mozilla included.","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/www.uxpin.com\/studio\/blog\/free-pocket-guide-color-theory-web-ui-design\/","og_locale":"en_US","og_type":"article","og_title":"Free pocket guide: Color Theory in Web UI Design","og_description":"A 35-page guide explaining how to use color to affect user mood and experience. 24 examples from companies like Squarespace & Mozilla included.","og_url":"https:\/\/www.uxpin.com\/studio\/blog\/free-pocket-guide-color-theory-web-ui-design\/","og_site_name":"Studio by UXPin","article_published_time":"2015-06-27T05:26:09+00:00","article_modified_time":"2020-04-22T13:38:34+00:00","og_image":[{"width":720,"height":330,"url":"https:\/\/www.uxpin.com\/studio\/wp-content\/uploads\/2015\/06\/blog-book2.png","type":"image\/png"}],"author":"Jerry Cao","twitter_card":"summary_large_image","twitter_misc":{"Written by":"Jerry Cao","Est. reading time":"1 minute"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/www.uxpin.com\/studio\/blog\/free-pocket-guide-color-theory-web-ui-design\/#article","isPartOf":{"@id":"https:\/\/www.uxpin.com\/studio\/blog\/free-pocket-guide-color-theory-web-ui-design\/"},"author":{"name":"Jerry Cao","@id":"https:\/\/www.uxpin.com\/studio\/#\/schema\/person\/e58da1b4c401eb288436977eb9810a18"},"headline":"Free pocket guide: Color Theory in Web UI Design","datePublished":"2015-06-27T05:26:09+00:00","dateModified":"2020-04-22T13:38:34+00:00","mainEntityOfPage":{"@id":"https:\/\/www.uxpin.com\/studio\/blog\/free-pocket-guide-color-theory-web-ui-design\/"},"wordCount":217,"image":{"@id":"https:\/\/www.uxpin.com\/studio\/blog\/free-pocket-guide-color-theory-web-ui-design\/#primaryimage"},"thumbnailUrl":"https:\/\/www.uxpin.com\/studio\/wp-content\/uploads\/2015\/06\/blog-book2.png","articleSection":["Blog","UI Design","UX Design","Web Design"],"inLanguage":"en-US"},{"@type":"WebPage","@id":"https:\/\/www.uxpin.com\/studio\/blog\/free-pocket-guide-color-theory-web-ui-design\/","url":"https:\/\/www.uxpin.com\/studio\/blog\/free-pocket-guide-color-theory-web-ui-design\/","name":"Free UI design e-book: Color Theory in Web UI Design","isPartOf":{"@id":"https:\/\/www.uxpin.com\/studio\/#website"},"primaryImageOfPage":{"@id":"https:\/\/www.uxpin.com\/studio\/blog\/free-pocket-guide-color-theory-web-ui-design\/#primaryimage"},"image":{"@id":"https:\/\/www.uxpin.com\/studio\/blog\/free-pocket-guide-color-theory-web-ui-design\/#primaryimage"},"thumbnailUrl":"https:\/\/www.uxpin.com\/studio\/wp-content\/uploads\/2015\/06\/blog-book2.png","datePublished":"2015-06-27T05:26:09+00:00","dateModified":"2020-04-22T13:38:34+00:00","author":{"@id":"https:\/\/www.uxpin.com\/studio\/#\/schema\/person\/e58da1b4c401eb288436977eb9810a18"},"description":"A 35-page guide explaining how to use color to affect user mood and experience. 24 examples from companies like Squarespace & Mozilla included.","breadcrumb":{"@id":"https:\/\/www.uxpin.com\/studio\/blog\/free-pocket-guide-color-theory-web-ui-design\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/www.uxpin.com\/studio\/blog\/free-pocket-guide-color-theory-web-ui-design\/"]}]},{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www.uxpin.com\/studio\/blog\/free-pocket-guide-color-theory-web-ui-design\/#primaryimage","url":"https:\/\/www.uxpin.com\/studio\/wp-content\/uploads\/2015\/06\/blog-book2.png","contentUrl":"https:\/\/www.uxpin.com\/studio\/wp-content\/uploads\/2015\/06\/blog-book2.png","width":720,"height":330,"caption":"blog book2"},{"@type":"BreadcrumbList","@id":"https:\/\/www.uxpin.com\/studio\/blog\/free-pocket-guide-color-theory-web-ui-design\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/www.uxpin.com\/studio\/"},{"@type":"ListItem","position":2,"name":"Free pocket guide: Color Theory in Web UI Design"}]},{"@type":"WebSite","@id":"https:\/\/www.uxpin.com\/studio\/#website","url":"https:\/\/www.uxpin.com\/studio\/","name":"Studio by UXPin","description":"","potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/www.uxpin.com\/studio\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"},{"@type":"Person","@id":"https:\/\/www.uxpin.com\/studio\/#\/schema\/person\/e58da1b4c401eb288436977eb9810a18","name":"Jerry Cao","description":"Jerry Cao is a content strategist at UXPin where he gets to put his overly active imagination to paper every day. In a past life, he developed content strategies for clients at Brafton and worked in traditional advertising at DDB San Francisco. In his spare time he enjoys playing electric guitar, watching foreign horror films, and expanding his knowledge of random facts. Follow him on Twitter.","sameAs":["http:\/\/uxpin.com"],"url":"https:\/\/www.uxpin.com\/studio\/author\/jerrycao\/"}]}},"_links":{"self":[{"href":"https:\/\/www.uxpin.com\/studio\/wp-json\/wp\/v2\/posts\/6791","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.uxpin.com\/studio\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.uxpin.com\/studio\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.uxpin.com\/studio\/wp-json\/wp\/v2\/users\/9"}],"replies":[{"embeddable":true,"href":"https:\/\/www.uxpin.com\/studio\/wp-json\/wp\/v2\/comments?post=6791"}],"version-history":[{"count":0,"href":"https:\/\/www.uxpin.com\/studio\/wp-json\/wp\/v2\/posts\/6791\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.uxpin.com\/studio\/wp-json\/wp\/v2\/media\/6802"}],"wp:attachment":[{"href":"https:\/\/www.uxpin.com\/studio\/wp-json\/wp\/v2\/media?parent=6791"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.uxpin.com\/studio\/wp-json\/wp\/v2\/categories?post=6791"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.uxpin.com\/studio\/wp-json\/wp\/v2\/tags?post=6791"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}