Rounded Corners by CSS Style to Blogger Blogs

What is Rounded Corners? This is a Round Shape corners instead of Square type corner. This round type corners not important to Blogging, But need to Beautiful design. Actually this type corners made by images in Blogger Templates. Default Rounded type Blogger(Blogspot Hosted) Templates using images to Style Corners. This type of images takes long time to load. If continue using this type, May loss Low Speed Internet Users as Readers.

Before and After Rounded Corners

I find many Websites to Generate CSS(Cascading Style Sheets) Codes for Rounded Corner Style. You can customize values like Color, Border width and Many more. This Change is simple no any critical Steps to Follow. I think the following two Websites Generate suitable codes with your Custom Options.

Spiffy Corners : This is simple and easy Code Generator, But unfortunately works only 5PX option. Color palette gives very high user friendly colors.

Roundedcornr : This Website has lot of options to customize CSS Style Corners than the previous website. This site has lack of Onsite color choosing option. So choose best one based on requirements.

How do Add Generated CSS Code into Blogger Template?
I choosed Spiffycorners code to explain here.
Login to Blogger >> Dashboard >> Layout >>Edit HTML [Backup your Blogger Template before any Modify]
First Step :
Copy and Paste the generated CSS code before </b:skin>
Your Template code must be the following style(Preview)

Next Step :
Add Generated HTML code where you want. You can choose Header, Main, Sidebar, Footer or any place you likes to show Rounded Shape Corners.
Actually split the code into Three parts.
Remove the line(This is centre part) <!-- content goes here -->

I choose Main Blog Posts Layout for Rounded Corners here.
Find the following code in your template

<b:section class='main' id='main' showaddelement='no'>
<b:widget id='Blog1' locked='true' title='Blog Posts' type='Blog'/>

Note : This code may vary in some Custom Templates, If you face any difficult, Try based on "Blog1" or "Blog Posts".
Add the First part of the HTML Code before this line and Last part of the HTML Code after the line.
Preview of Blogger Template Code must be the following style:


Check preview of Blog, If you satisfy, Save Template.
Note : Color Matching of Blogger Template Layout Backgrounds and CSS Style Code are necessary for best Appearance.
If you Find any errors or Having any easy method Share Here via valued Comments.
Read : How do better Posting to Blogger