{"id":16716,"date":"2013-03-20T21:01:13","date_gmt":"2013-03-20T13:01:13","guid":{"rendered":"https:\/\/www.hongkiat.com\/blog\/?p=16716"},"modified":"2020-04-27T19:15:56","modified_gmt":"2020-04-27T11:15:56","slug":"website-color-scheme","status":"publish","type":"post","link":"https:\/\/www.hongkiat.com\/blog\/website-color-scheme\/","title":{"rendered":"Practical Approach to Choosing Website Color Scheme"},"content":{"rendered":"<p>Imagine a world without colors; that world would be such a boring place, right? This applies to websites without colors. Yet, deciding colors for website is not an easy task. I personally have been asked quite often on <strong>how to choose the right colors<\/strong>. If you are also wondering the same thing, this post is probably for you.<\/p>\n<p>In this post, we are going to look into some <strong>simple and practical ways<\/strong> to choose colors for your website especially. You might also want to look at Jake\u2019s post about the <a target=\"_blank\" href=\"https:\/\/www.hongkiat.com\/blog\/basics-behind-color-theory-for-web-designer\/\" rel=\"noopener noreferrer\">basics behind Color Theory<\/a> and how less (or <a target=\"_blank\" href=\"https:\/\/www.hongkiat.com\/blog\/three-color-websites\/\" rel=\"noopener noreferrer\">fewer colors<\/a>) is <a target=\"_blank\" href=\"https:\/\/www.hongkiat.com\/blog\/dark-color-websites\/\" rel=\"noopener noreferrer\">more<\/a> for <a target=\"_blank\" href=\"https:\/\/www.hongkiat.com\/blog\/blue-web-design\/\" rel=\"noopener noreferrer\">some<\/a> websites.<\/p>\n<div class=\"ref-block ref-block--post\" id=\"ref-post-1\">\n\t\t\t\t\t<a href=\"https:\/\/www.hongkiat.com\/blog\/best-color-tools-for-web-designers\/\" class=\"ref-block__link\" title=\"Read More: Best Color Tools for Web Designers\" rel=\"bookmark\"><span class=\"screen-reader-text\">Best Color Tools for Web Designers<\/span><\/a>\n<div class=\"ref-block__thumbnail img-thumb img-thumb--jumbo\" data-img='{ \"src\" : \"https:\/\/assets.hongkiat.com\/uploads\/thumbs\/250x160\/best-color-tools-for-web-designers.jpg\" }'>\n\t\t\t\t\t\t\t<noscript>\n<style>.no-js #ref-block-post-960 .ref-block__thumbnail { background-image: url(\"https:\/\/assets.hongkiat.com\/uploads\/thumbs\/250x160\/best-color-tools-for-web-designers.jpg\"); }<\/style>\n<\/noscript>\n\t\t\t\t\t\t<\/div>\n<div class=\"ref-block__summary\">\n<h4 class=\"ref-title\">Best Color Tools for Web Designers<\/h4>\n<p class=\"ref-description\">\n\t\t\t\t\t\tSetting a basic color theme for your web design project might be easy, but deciding the right color...\t\t\t\t\t\t<span>Read more<\/span><\/p>\n<\/div>\n<\/div>\n<h2>1. Brands and Identity<\/h2>\n<p>This is I think the easiest way. If you are currently working on a website for an established company or a well-known organization, choosing the color scheme would take no time at all, you can simply extract it from their brand identity.<\/p>\n<p>For example, for McDonald\u2019s you can instantly identify McDonald\u2019s from their golden \u201cM\u201d logo with solid red as the background fill.<\/p>\n<figure><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/assets.hongkiat.com\/uploads\/website-color-scheme\/mcd-logo.jpg?newedit\" alt=\"website color scheme\" width=\"500\" height=\"280\"><\/figure>\n<p>This identity is recognized around the globe, so if you for some reason use Green or Blue instead, people would probably not recognize it as McDonald\u2019s, instantly. Thus, it is more sensible to use these colors as the primary colors.<\/p>\n<figure><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/assets.hongkiat.com\/uploads\/website-color-scheme\/color-pallete.jpg?newedit\" alt=\"color pallete\" width=\"500\" height=\"280\"><\/figure>\n<p>We can then expand these color variations by tuning the tone (like <strong>contrast<\/strong> and the <strong>lightness<\/strong>). And there you go, we now have decent variations to make up the website\u2019s color themes.<\/p>\n<figure><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/assets.hongkiat.com\/uploads\/website-color-scheme\/color-variations.jpg?newedit\" alt=\"color variations\" width=\"500\" height=\"280\"><\/figure>\n<p>In some cases, these colors are even dominantly applied, like in McDonald\u2019s Australia.<\/p>\n<h3>McDonald\u2019s Australia<\/h3>\n<figure><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/assets.hongkiat.com\/uploads\/website-color-scheme\/mcd-australia.jpg?newedit\" alt=\"mcd australia\" width=\"600\" height=\"450\"><\/figure>\n<p>Here are some other examples:<\/p>\n<h3>Coca Cola Indonesia<\/h3>\n<figure><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/assets.hongkiat.com\/uploads\/website-color-scheme\/coca-cola.jpg?newedit\" alt=\"coke website\" width=\"600\" height=\"450\"><\/figure>\n<h3><strong>Pepsi<\/strong><\/h3>\n<figure><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/assets.hongkiat.com\/uploads\/website-color-scheme\/pepsi.jpg?newedit\" alt=\"pepsi website\" width=\"600\" height=\"450\"><\/figure>\n<h3>Starbucks<\/h3>\n<figure><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/assets.hongkiat.com\/uploads\/website-color-scheme\/starbuck.jpg?newedit\" alt=\"starbucks website\" width=\"600\" height=\"450\"><\/figure>\n<h2>2. Country-Specific<\/h2>\n<p>A country is more or less similar to a company; they also have an identifier, their flag. So it is also practical to extract the color scheme from the flag itself. There is one good example of this, the page of the former US President, <a rel=\"nofollow noopener noreferrer\" target=\"_blank\" href=\"https:\/\/barackobama.com\/\">BarackObama.com<\/a>.<\/p>\n<p>In the website (before it was redesigned) the colors used clearly corresponds with the US\u2019s flag which were red, white and blue.<\/p>\n<figure><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/assets.hongkiat.com\/uploads\/website-color-scheme\/barack-obama.jpg?newedit\" alt=\"obama webste\" width=\"600\" height=\"450\"><\/figure>\n<h3>Culture, People and Environment<\/h3>\n<p>The problem with using color schemes based on country flags is you are bound to bump into the same color scheme, for instance France also uses red, white and blue. If this is the case, we can try exploring their culture, people and environment instead. Let\u2019s take a look at the picture below.<\/p>\n<figure><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/assets.hongkiat.com\/uploads\/website-color-scheme\/fuji-mount.jpg?newedit\" alt=\"mount fuji\" width=\"600\" height=\"418\"><\/figure>\n<p>This picture is a beautiful view of mount Fuji of Japan. This picture has provided sufficient color information and these are the colors extracted from it.<\/p>\n<figure><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/assets.hongkiat.com\/uploads\/website-color-scheme\/colors-fuji.jpg?newedit\" alt=\"fuji colors\" width=\"500\" height=\"280\"><\/figure>\n<p>This approach is probably useful when you are working on a government or tourism website for specific countries. Here are a few good examples:<\/p>\n<h3>Africa<\/h3>\n<p>If you scroll down the page, you will see some of the colors applied in the design are from the country flag; like Green, Red, Black and Yellow.<\/p>\n<figure><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/assets.hongkiat.com\/uploads\/website-color-scheme\/africa.jpg?newedit\" alt=\"africa\" width=\"600\" height=\"364\"><\/figure>\n<h3><strong>Visit Korea<\/strong><\/h3>\n<figure><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/assets.hongkiat.com\/uploads\/website-color-scheme\/visit-korea.jpg?newedit\" alt=\"visit korea\" width=\"600\" height=\"450\"><\/figure>\n<h3><strong>Australia Tourism<\/strong><\/h3>\n<figure><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/assets.hongkiat.com\/uploads\/website-color-scheme\/australi-tourism.jpg?newedit\" alt=\"australia tourism\" width=\"600\" height=\"364\"><\/figure>\n<h2>3. Content and Context<\/h2>\n<p>Not working out for you? Time to explore. Generally, websites should have contents to display. There are two primary questions to ask to help identify the proper colors:<\/p>\n<ul>\n<li>What is the content about?<\/li>\n<li>And, who will most likely read the content?<\/li>\n<\/ul>\n<p>For example, let\u2019s say you are building a website that will cover everything about babies. So, the content is clearly about infants, but who is going to read it? It is most likely the mothers. After spinning around for a while we can extract some keywords that will guide us to choose the colors, which in this case are: <strong>Babies, Mothers, Female, and baby things (Food, Toys, Diapers etc).<\/strong><\/p>\n<p>At this point, we can then look for the sources and samples for these keywords to extract the colors, whether by looking around your surrounding or Googling sample images.<\/p>\n<p>We have done the job from this example and I think these are the appropriate colors for our case.<\/p>\n<figure><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/assets.hongkiat.com\/uploads\/website-color-scheme\/baby-colors.jpg?newedit\" alt=\"baby colors\" width=\"500\" height=\"280\"><\/figure>\n<p>The colors are babyish and feminine (pink), yet the combination could also be stronger with the addition of <strong>Green, Orange and Purple to complement<\/strong>.<\/p>\n<p>And here are some examples in this case.<\/p>\n<h3>Balita Theme<\/h3>\n<figure><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/assets.hongkiat.com\/uploads\/website-color-scheme\/balita.jpg?newedit\" alt=\"balita\" width=\"600\" height=\"450\"><\/figure>\n<h3>Metariza<\/h3>\n<figure><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/assets.hongkiat.com\/uploads\/website-color-scheme\/metariza.jpg?newedit\" alt=\"metariza\" width=\"600\" height=\"450\"><\/figure>\n<h2>Conclusion<\/h2>\n<p>Practically, we can apply any of these approaches discussed here for any design cases. In addition, to do the job of color extraction quicker, you can use this tool <a href=\"https:\/\/www.colourlovers.com\/photocopa\" rel=\"nofollow\">Photocopa<\/a>.<\/p>\n<p>Lastly, do you have other useful approaches to add? Feel free to share your thoughts in the comment box below.<\/p>","protected":false},"excerpt":{"rendered":"<p>Imagine a world without colors; that world would be such a boring place, right? This applies to websites without colors. Yet, deciding colors for website is not an easy task. I personally have been asked quite often on how to choose the right colors. If you are also wondering the same thing, this post is&hellip;<\/p>\n","protected":false},"author":113,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_jetpack_memberships_contains_paid_content":false,"footnotes":""},"categories":[352],"tags":[4497],"topic":[4520],"class_list":["entry-content","is-maxi"],"acf":[],"yoast_head":"<!-- This site is optimized with the Yoast SEO Premium plugin v22.8 (Yoast SEO v27.6) - https:\/\/yoast.com\/product\/yoast-seo-premium-wordpress\/ -->\n<title>How to Choose Color Scheme For Your Website - Hongkiat<\/title>\n<meta name=\"description\" content=\"Imagine a world without colors; that world would be such a boring place, right? This applies to websites without colors. Yet, deciding colors for website\" \/>\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.hongkiat.com\/blog\/website-color-scheme\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Practical Approach to Choosing Website Color Scheme\" \/>\n<meta property=\"og:description\" content=\"Imagine a world without colors; that world would be such a boring place, right? This applies to websites without colors. Yet, deciding colors for website\" \/>\n<meta property=\"og:url\" content=\"https:\/\/www.hongkiat.com\/blog\/website-color-scheme\/\" \/>\n<meta property=\"og:site_name\" content=\"Hongkiat\" \/>\n<meta property=\"article:publisher\" content=\"https:\/\/www.facebook.com\/hongkiatcom\" \/>\n<meta property=\"article:published_time\" content=\"2013-03-20T13:01:13+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2020-04-27T11:15:56+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/assets.hongkiat.com\/uploads\/website-color-scheme\/mcd-logo.jpg?newedit\" \/>\n<meta name=\"author\" content=\"Thoriq Firdaus\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:creator\" content=\"@tfirdaus\" \/>\n<meta name=\"twitter:site\" content=\"@hongkiat\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"Thoriq Firdaus\" \/>\n\t<meta name=\"twitter:label2\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data2\" content=\"4 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\\\/\\\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/website-color-scheme\\\/#article\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/website-color-scheme\\\/\"},\"author\":{\"name\":\"Thoriq Firdaus\",\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/#\\\/schema\\\/person\\\/e7948c7a175d211496331e4b6ce55807\"},\"headline\":\"Practical Approach to Choosing Website Color Scheme\",\"datePublished\":\"2013-03-20T13:01:13+00:00\",\"dateModified\":\"2020-04-27T11:15:56+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/website-color-scheme\\\/\"},\"wordCount\":747,\"commentCount\":44,\"publisher\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/#organization\"},\"image\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/website-color-scheme\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/assets.hongkiat.com\\\/uploads\\\/website-color-scheme\\\/mcd-logo.jpg?newedit\",\"keywords\":[\"Colors Theory\"],\"articleSection\":[\"Web Design\"],\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"CommentAction\",\"name\":\"Comment\",\"target\":[\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/website-color-scheme\\\/#respond\"]}]},{\"@type\":\"WebPage\",\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/website-color-scheme\\\/\",\"url\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/website-color-scheme\\\/\",\"name\":\"How to Choose Color Scheme For Your Website - Hongkiat\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/website-color-scheme\\\/#primaryimage\"},\"image\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/website-color-scheme\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/assets.hongkiat.com\\\/uploads\\\/website-color-scheme\\\/mcd-logo.jpg?newedit\",\"datePublished\":\"2013-03-20T13:01:13+00:00\",\"dateModified\":\"2020-04-27T11:15:56+00:00\",\"description\":\"Imagine a world without colors; that world would be such a boring place, right? This applies to websites without colors. Yet, deciding colors for website\",\"breadcrumb\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/website-color-scheme\\\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/website-color-scheme\\\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/website-color-scheme\\\/#primaryimage\",\"url\":\"https:\\\/\\\/assets.hongkiat.com\\\/uploads\\\/website-color-scheme\\\/mcd-logo.jpg?newedit\",\"contentUrl\":\"https:\\\/\\\/assets.hongkiat.com\\\/uploads\\\/website-color-scheme\\\/mcd-logo.jpg?newedit\"},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/website-color-scheme\\\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Practical Approach to Choosing Website Color Scheme\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/#website\",\"url\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/\",\"name\":\"Hongkiat\",\"description\":\"Tech and Design Tips\",\"publisher\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"en-US\"},{\"@type\":\"Organization\",\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/#organization\",\"name\":\"Hongkiat.com\",\"url\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/#\\\/schema\\\/logo\\\/image\\\/\",\"url\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/wp-content\\\/uploads\\\/hkdc-logo-rect-yoast.jpg\",\"contentUrl\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/wp-content\\\/uploads\\\/hkdc-logo-rect-yoast.jpg\",\"width\":1200,\"height\":799,\"caption\":\"Hongkiat.com\"},\"image\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/#\\\/schema\\\/logo\\\/image\\\/\"},\"sameAs\":[\"https:\\\/\\\/www.facebook.com\\\/hongkiatcom\",\"https:\\\/\\\/x.com\\\/hongkiat\",\"https:\\\/\\\/www.pinterest.com\\\/hongkiat\\\/\"]},{\"@type\":\"Person\",\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/#\\\/schema\\\/person\\\/e7948c7a175d211496331e4b6ce55807\",\"name\":\"Thoriq Firdaus\",\"description\":\"Thoriq is a writer for Hongkiat.com with a passion for web design and development. He is the author of Responsive Web Design by Examples, where he covered his best approaches in developing responsive websites quickly with a framework.\",\"sameAs\":[\"https:\\\/\\\/thoriq.com\",\"https:\\\/\\\/x.com\\\/tfirdaus\"],\"jobTitle\":\"Web Developer\",\"url\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/author\\\/thoriq\\\/\"}]}<\/script>\n<!-- \/ Yoast SEO Premium plugin. -->","yoast_head_json":{"title":"How to Choose Color Scheme For Your Website - Hongkiat","description":"Imagine a world without colors; that world would be such a boring place, right? This applies to websites without colors. Yet, deciding colors for website","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.hongkiat.com\/blog\/website-color-scheme\/","og_locale":"en_US","og_type":"article","og_title":"Practical Approach to Choosing Website Color Scheme","og_description":"Imagine a world without colors; that world would be such a boring place, right? This applies to websites without colors. Yet, deciding colors for website","og_url":"https:\/\/www.hongkiat.com\/blog\/website-color-scheme\/","og_site_name":"Hongkiat","article_publisher":"https:\/\/www.facebook.com\/hongkiatcom","article_published_time":"2013-03-20T13:01:13+00:00","article_modified_time":"2020-04-27T11:15:56+00:00","og_image":[{"url":"https:\/\/assets.hongkiat.com\/uploads\/website-color-scheme\/mcd-logo.jpg?newedit","type":"","width":"","height":""}],"author":"Thoriq Firdaus","twitter_card":"summary_large_image","twitter_creator":"@tfirdaus","twitter_site":"@hongkiat","twitter_misc":{"Written by":"Thoriq Firdaus","Est. reading time":"4 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/www.hongkiat.com\/blog\/website-color-scheme\/#article","isPartOf":{"@id":"https:\/\/www.hongkiat.com\/blog\/website-color-scheme\/"},"author":{"name":"Thoriq Firdaus","@id":"https:\/\/www.hongkiat.com\/blog\/#\/schema\/person\/e7948c7a175d211496331e4b6ce55807"},"headline":"Practical Approach to Choosing Website Color Scheme","datePublished":"2013-03-20T13:01:13+00:00","dateModified":"2020-04-27T11:15:56+00:00","mainEntityOfPage":{"@id":"https:\/\/www.hongkiat.com\/blog\/website-color-scheme\/"},"wordCount":747,"commentCount":44,"publisher":{"@id":"https:\/\/www.hongkiat.com\/blog\/#organization"},"image":{"@id":"https:\/\/www.hongkiat.com\/blog\/website-color-scheme\/#primaryimage"},"thumbnailUrl":"https:\/\/assets.hongkiat.com\/uploads\/website-color-scheme\/mcd-logo.jpg?newedit","keywords":["Colors Theory"],"articleSection":["Web Design"],"inLanguage":"en-US","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https:\/\/www.hongkiat.com\/blog\/website-color-scheme\/#respond"]}]},{"@type":"WebPage","@id":"https:\/\/www.hongkiat.com\/blog\/website-color-scheme\/","url":"https:\/\/www.hongkiat.com\/blog\/website-color-scheme\/","name":"How to Choose Color Scheme For Your Website - Hongkiat","isPartOf":{"@id":"https:\/\/www.hongkiat.com\/blog\/#website"},"primaryImageOfPage":{"@id":"https:\/\/www.hongkiat.com\/blog\/website-color-scheme\/#primaryimage"},"image":{"@id":"https:\/\/www.hongkiat.com\/blog\/website-color-scheme\/#primaryimage"},"thumbnailUrl":"https:\/\/assets.hongkiat.com\/uploads\/website-color-scheme\/mcd-logo.jpg?newedit","datePublished":"2013-03-20T13:01:13+00:00","dateModified":"2020-04-27T11:15:56+00:00","description":"Imagine a world without colors; that world would be such a boring place, right? This applies to websites without colors. Yet, deciding colors for website","breadcrumb":{"@id":"https:\/\/www.hongkiat.com\/blog\/website-color-scheme\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/www.hongkiat.com\/blog\/website-color-scheme\/"]}]},{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www.hongkiat.com\/blog\/website-color-scheme\/#primaryimage","url":"https:\/\/assets.hongkiat.com\/uploads\/website-color-scheme\/mcd-logo.jpg?newedit","contentUrl":"https:\/\/assets.hongkiat.com\/uploads\/website-color-scheme\/mcd-logo.jpg?newedit"},{"@type":"BreadcrumbList","@id":"https:\/\/www.hongkiat.com\/blog\/website-color-scheme\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/www.hongkiat.com\/blog\/"},{"@type":"ListItem","position":2,"name":"Practical Approach to Choosing Website Color Scheme"}]},{"@type":"WebSite","@id":"https:\/\/www.hongkiat.com\/blog\/#website","url":"https:\/\/www.hongkiat.com\/blog\/","name":"Hongkiat","description":"Tech and Design Tips","publisher":{"@id":"https:\/\/www.hongkiat.com\/blog\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/www.hongkiat.com\/blog\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"},{"@type":"Organization","@id":"https:\/\/www.hongkiat.com\/blog\/#organization","name":"Hongkiat.com","url":"https:\/\/www.hongkiat.com\/blog\/","logo":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www.hongkiat.com\/blog\/#\/schema\/logo\/image\/","url":"https:\/\/www.hongkiat.com\/blog\/wp-content\/uploads\/hkdc-logo-rect-yoast.jpg","contentUrl":"https:\/\/www.hongkiat.com\/blog\/wp-content\/uploads\/hkdc-logo-rect-yoast.jpg","width":1200,"height":799,"caption":"Hongkiat.com"},"image":{"@id":"https:\/\/www.hongkiat.com\/blog\/#\/schema\/logo\/image\/"},"sameAs":["https:\/\/www.facebook.com\/hongkiatcom","https:\/\/x.com\/hongkiat","https:\/\/www.pinterest.com\/hongkiat\/"]},{"@type":"Person","@id":"https:\/\/www.hongkiat.com\/blog\/#\/schema\/person\/e7948c7a175d211496331e4b6ce55807","name":"Thoriq Firdaus","description":"Thoriq is a writer for Hongkiat.com with a passion for web design and development. He is the author of Responsive Web Design by Examples, where he covered his best approaches in developing responsive websites quickly with a framework.","sameAs":["https:\/\/thoriq.com","https:\/\/x.com\/tfirdaus"],"jobTitle":"Web Developer","url":"https:\/\/www.hongkiat.com\/blog\/author\/thoriq\/"}]}},"jetpack_featured_media_url":"https:\/\/","jetpack_shortlink":"https:\/\/wp.me\/p4uxU-4lC","jetpack_sharing_enabled":true,"_links":{"self":[{"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/posts\/16716","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/users\/113"}],"replies":[{"embeddable":true,"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/comments?post=16716"}],"version-history":[{"count":3,"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/posts\/16716\/revisions"}],"predecessor-version":[{"id":50128,"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/posts\/16716\/revisions\/50128"}],"wp:attachment":[{"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/media?parent=16716"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/categories?post=16716"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/tags?post=16716"},{"taxonomy":"topic","embeddable":true,"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/topic?post=16716"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}