Web design color image

Introduction

We are currently creating an original app. I investigated the concept of color when mounting the front of the top page. Write it down so that you can remember it even if you forget it.

Development environment ruby 2.6.5 Rails 6.0.3.4

table of contents

  1. Color effect
  2. Color scheme of the original app

1. Color effect

Colors used in web design need to be selected according to purpose. It is important to stand from the perspective of the user who uses the website.

Red </ font>

Hot, vitality, warning </ font>

Orange </ font>

Intimacy, cheerful

Yellow </ font>

Curiosity, cooperation

Green </ font>

Nature, relax

blue </ font>

Cold, tranquility, honesty </ font>

Purple </ font>

Late, dignity

Pink </ font>

Soft and cute

Brown </ font>

Stability, trust, history

2. Color scheme of the original app

The original application is roughly divided into the following two functions. Implemented so that each link can be transitioned from the top page. ・ Cleaning proposal to users ・ Sharing of cleaned desk images

Made the "Cleaning suggestions to users" link reddish. This is to encourage (warning) cleaning. "Sharing cleaned desk images" is blue. Since this is supposed to be a desk after cleaning, I chose blue to give an image of cleanliness. image.png

reference [HTML-CSS and Web Design Introductory Course to Learn All in One Book](https://www.amazon.co.jp/1%E5%86%8A%E3%81%A7%E3%81%99% E3% 81% B9% E3% 81% A6% E8% BA% AB% E3% 81% AB% E3% 81% A4% E3% 81% 8FHTML-CSS% E3% 81% A8Web% E3% 83% 87% E3% 82% B6% E3% 82% A4% E3% 83% B3% E5% 85% A5% E9% 96% 80% E8% AC% 9B% E5% BA% A7-Mana / dp / 4797398892 / ref = asc_df_4797398892 /? tag = jpgo-22 & linkCode = df0 & hvadid = 295723231663 & hvpos = & hvnetw = g & hvrand = 14579486333190010068 & hvpone = & hvptwo = & hvqmt = / hvdev = c & hvdvcmdl = & hvlocint = & hvlocphy = 1663d How to color with Qiita markdown [140 colors]