MENU service case
Website construction website design Beijing website construction high-end website production company Shangpin China
We create by embracing change
360 ° brand value__
simplified Chinese character
Simplified Chinese English

Shangpin China Joins Hands with Beisheng Internet to Create a New Chapter in Website Construction

Type: Shangpin Dynamic Learn more

How to deal with color in website UI design?

Source: Shangpin China | Type: website encyclopedia | Time: June 6, 2018
Laws
60-30-10 rule
This is an unfashionable decoration skill in the field of interior design, which can easily help you complete a Website Design Color scheme. The proportion of 60%+30%+10% is to balance the colors. The beauty of this formula is that it creates a sense of balance so that the eyes can move comfortably from one focus to another. At the same time, it is also very simple to use.
60% is the main color, 30% is the auxiliary color, and 10% is the accent color.  
 
Focus on the meaning of color
For centuries, scientists have been studying the emotional effects of color. In addition to creating aesthetics, color is also the creator of emotion and association. The meaning of color varies according to culture and circumstances. That's why you can see a black and white fashion shop. Because they want to be elegant and advanced.
Red: passion, love, danger
Blue: calm, responsible and safe
Black: mysterious, elegant, evil
White: pure, quiet and clean
Green: fresh, fresh and natural
We are used to adjusting colors and tones early in the design phase. However, when you realize that it took you 3 hours to adjust the main color, you find this behavior is not helpful. Although playing with colors is very attractive, you should avoid this behavior at the beginning of design.
Instead, you should force yourself to focus on adjusting spacing and layout elements. This layout constraint is very effective and will save you a lot of time. Adjusting spacing and layout elements is not so boring. If you want to express something different, try using different colors.  
 
Keep away from pure gray and pure black
Over the years, one of the most important color tips I have learned is to avoid using non toned gray. In real life, pure gray almost doesn't exist. The same is true of black. (Yes, in fact, it's colorful black)
The darkest color in this picture is not pure black, but # 0A0A10
Remember to add some hue to your color. Users will subconsciously feel that these colors are more natural and familiar.
 
Believe in nature
The best color combination comes from nature. They always look very natural. The advantage of looking for design solutions based on the natural environment is that you can have countless color plates, because the color of nature is always changing.
We just need to look around to get inspiration.
 
Keep contrast
Some colors match with some colors, and conflict with others. Through the color wheel, the rules of color interaction can be well observed. You should clearly understand this method, but you should do it yourself.
 
Get inspired
When we talk about UI reference, Dribbble is a good choice. Dribbble also has a color search tool. So if you want to do visual research on a specific color,
You can go to dribble.com/colors
Video, print design, interior design, fashion... There are many inspirations. Be sensitive to all forms of color palette, and save everything that looks interesting. I will get color inspiration from Korean Wave videos
 
Tools
In order to save your time, here are some useful palette tools for 2017. They will save you a lot of time. My favorite color selection tool. You can simply lock the color and press and hold the Spacebar to generate the color palette. Coolors.co also supports uploading images and extracting color swatches from images. Coolors.co is cool. You don't just have a result. On the contrary, you can adjust your color through the selector to obtain many color schemes.
Links (no wall climbing): //coolors.co/
 
Kuler
This tool from Adobe has been with us for a long time. It can be used in browsers or desktop applications. If you are using a desktop application, you can export the color scheme to Photoshop.
Links (no wall climbing): //color.adobe.com/zh/create/color-wheel/
 
Paletton
It is similar to Kuler, the previous tool. The difference is that it is not limited to five tones. This is a great tool when you have determined the main color and want to adjust the auxiliary color.
Link (wall climbing required): //paletton.com/
 
Shutterstock Lab Spectrum
You may ask: What if I want to search for pictures with the color I choose? Then, Shutterstock has a tool called Spectrum that can meet your needs. You can search for images through specific colors. You don't even need to be called a member, because even small preview images with watermarks are enough to generate color swatches.
Source Statement: This article is original or edited by Shangpin China's editors. If it needs to be reproduced, please indicate that it is from Shangpin China. The above contents (including pictures and words) are from the Internet. If there is any infringement, please contact us in time (010-60259772).
TAG label:

What if your website can increase the number of conversions and improve customer satisfaction?

Make an appointment with a professional consultant to communicate!

* Shangpin professional consultant will contact you as soon as possible

Disclaimer

Thank you very much for visiting our website. Please read all the terms of this statement carefully before you use this website.

1. Part of the content of this site comes from the network, and the copyright of some articles and pictures involved belongs to the original author. The reprint of this site is for everyone to learn and exchange, and should not be used for any commercial activities.

2. This website does not assume any form of loss or injury caused by users to themselves and others due to the use of these resources.

3. For issues not covered in this statement, please refer to relevant national laws and regulations. In case of conflict between this statement and national laws and regulations, the national laws and regulations shall prevail.

4. If it infringes your legitimate rights and interests, please contact us in time, and we will delete the relevant content at the first time!

Contact: 010-60259772
E-mail: [email protected]

Communicate with professional consultants now!

  • National Service Hotline

    400-700-4979

  • Beijing Service Hotline

    010-60259772

Please be assured to fill in the information protection
Online consultation

Disclaimer

Thank you very much for visiting our website. Please read all the terms of this statement carefully before you use this website.

1. Part of the content of this site comes from the network, and the copyright of some articles and pictures involved belongs to the original author. The reprint of this site is for everyone to learn and exchange, and should not be used for any commercial activities.

2. This website does not assume any form of loss or injury caused by users to themselves and others due to the use of these resources.

3. For issues not covered in this statement, please refer to relevant national laws and regulations. In case of conflict between this statement and national laws and regulations, the national laws and regulations shall prevail.

4. If it infringes your legitimate rights and interests, please contact us in time, and we will delete the relevant content at the first time!

Contact: 010-60259772
E-mail: [email protected]