Best colors for a website, DIY

How to use colors on your website.

It is not that difficult to use specific colors on your website, you just have to know how. The theme of your website and your header have colors already. You choose them because you liked these colors. And to get a unity on your website and the best colors for a website, we are taking a screenshot first.

1. Go to Imagecolorpicker Online and load up your screenshot.

2. Pick every color on your website header and text.

3. Write your codes down.

The best colors for my website are:

Blue #3069b0; #053877; #316AB0;

Green #92C7BD; ACCFCB;

Rust #782F26;

Light pink #E7D2F3;

Text #242424;

How to use the best colors for a website in borders and text.

I have used the xmp tag to prevent the codes I display are executed by the theme. So you can copy them.

<xmp>Copy from here<div style=”width: 200px; height: 100px; border: 8px inset #ff0000;”>I have used the xmp tag to prevent the codes I display are executed by the theme. So you can copy them</div>until here</xmp>

Border codes you can use:

solid, dotted, dashed, double, groove, ridge, inset, outset, and mixed

Change Text color

When you use the A , you can’t fill in a hexa color number, so just click any number, go over to your text editor and change it into the hexa color code you want it to be.

<xmp>Copy from here<div style=”width: 200px; height: 300px; border: 3px dashed #ff0000;”><h2>Change Text color</h2>
When you use the A , you can’t fill in a hexa color number, so just click any number, go over to your text editor and change it into the hexa color code you want it to be.</div>until here</xmp>

SOLID (For changing text color, select word and choose #3069B0)

For this box I have used “solid blue # color, you can change the border px, width&height

<xmp>Copy from here <div style=”width: 200px; height: 100px; border: 3px solid #3069B0;”>For this box I have used “solid blue # color, you can change the border px, width&height</div> until here</xmp>

DOTTED (For changing text color, select word and choose your color, mine is #92C7BD)

This box has a dotted green html border. You see I have changed some values

<xmp>Copy from here<div style=”width: 700px; height: 50px; border: 6px dotted #92C7BD;”>This box has a dotted green html border. You see I have changed some values</div>until here</xmp>

MIXED (For changing text color, Select word and change color, #782F26)

In this box I have mixed a few to create this border. By using solid, dashed, dotted, and double. This way you can play around with all kind of effects.

<xmp>Copy from here<div style=”width: 200px; height: 200px; border-width: 6px; border-color: #782F26; border-style: dotted dashed solid double;”>In this box I have mixed a few to create this border. By using solid, dashed, dotted, and double. This way you can play around with all kind of effects.</div>until here</xmp>

CHANGE POSITION #0073E7

class=”alignleft”

class=”aligncenter”

class=”alignright”

class=”alignnone”

For this box I have used “outset blue # color, you can change the border px, width&height

<xmp>Copy from here<div class=”aligncenter” style=”width: 200px; height: 150px; border: 20px outset #190FC8;”>For this box I have used “outset blue # color, you can change the border px, width&height</div>until here</xmp>

Click here for additional information from a fellow blogger, “What Is Color Psychology And Why Is It Important In Marketing?”