Make a Color Picker Tool on a Static Page Blog with a New Style

Changing the color in the template or other parts of the blog does not require special expertise. You can simply copy the desired color code and then attach it to the CSS code and it will automatically change the selected HTML display color. Choosing the right color also does not require special skills, you can simply copy the color code through the color picker tool that is widely available on several websites.

What if then you want to make your own color picker tool and install it on a static blog page. This has been done by many bloggers, including myself.

Here, I will share 2 different types of styles in this color picker. If you are interested in installing it on your blog, please choose the style that suits you best to pair as a color picker tool on the statistics page.

First Color Picker Style

     
         
         
         
     
      
         
         
             
HSL:
             
RGB:
             
Hex:
         
     
 
      

Second Color Picker Style

       
color: {{ foo }}
 
    

How to Make a Color Picker Tool on Blogger Static Pages

1. Login to Blogger Account > Page > New Page
2. Write the title of the page first. For example here I wrote "Color Picker". This is according to taste or by writing the page title you want then click "publish".
3. Go back to the page that you have created then select the HTML menu (next to Compose).4. Copy and paste all the code in one of the color picker tools above into the HTML page.
4. Finally click "Upadate".

Now please check the results by opening the page that you created.