Welcome Here And Thanks For Visiting. Like Us On Facebook...

EXEIdeas – Let's Your Mind Rock » CSS Codes / HTML-CSS-PHP-JavaScript » How To Add Stroke Around Text Using CSS Customization?

How To Add Stroke Around Text Using CSS Customization?

As in the era of CSS, every thing can be done by CSS. Now as you know that strokes was only made through Photoshop and other photo editing software but now CSS make it ore easy to do it online. Now you can add strokes around your text using pure CSS only.

So now you can use it without any pixel problem as fonts are vector and CSS also work as vector so it will not be stretch even your fonts are 1000px of size. You can also check it compatibility at Can I Use


1.) No Need To Use Image.
2.) Pure CSS3 Codes.
3.) Full Features Code.
4.) WebKit Support Only
5.) Many Browser Supported.

Here we are sharing CSS codes that you have to add in your template CSS file or inline CSS of your any text. There are two type as one is all in one and other is briefly explained for new designers. So just copy paste and edit it with your desire.

color: white;
-webkit-text-stroke: 2px black;

color: white;
-webkit-text-stroke-width: 2px;
-webkit-text-stroke-color: black;

This Is A DEMO


You just have to change Stroke width and color. Rest your all CSS will be used here.

Recommended For You:
All About CSS3 With Features, Requirment And Information

Last Words:

This is what we have for designers. So if you liked it then share it and leave your feedback. If you have quires then feel free to ask us.

You Like It, Please Share This Recipe With Your Friends Using...

2 Responses to “How To Add Stroke Around Text Using CSS Customization?”

  1. Nice Work Hassan Bro.

Leave a Reply

Your email address will not be published. Required fields are marked *