By default, the Divi Theme uses Open Sans as the font for all headers and paragraph text. You may sometimes find it boring, but hopefully after looking at this, you’ll be filled with ideas on how to jazz it up. We offer you five examples of the default text and the CSS we used to change it.

 

 

And here’s the CSS we used…

p.demo-one {
 font-size: 18px;
 text-transform: capitalize;
 font-weight: 600;
 letter-spacing: -0.5px;
 }

p.demo-two {
 font-size: 28px;
 text-transform: uppercase;
 font-weight: 900;
 letter-spacing: 0.5px;
 }

p.demo-three {
 text-transform: uppercase;
 letter-spacing: 2px;
 font-size: 24px;
 font-weight: 100;
 word-spacing: 2px;
 }

p.demo-four {
 font-style: italic;
 font-size: 30px;
 font-weight: 100;
 background: #e3e3e3;
 border-radius: 10px;
 border: 1px solid #b3b3b3;
 box-shadow: inset 0 0 25px #303030;
 padding-top: 14px;
 padding-right: 20px;
 padding-bottom: 14px;
 padding-left: 20px;
 line-height: 40px;
 }

p.demo-five {
 color: #000000;
 font-weight: bold;
 line-height: 30px;
 font-size: 25px;
 text-transform: uppercase;
 letter-spacing: -1px;
 border-bottom: double 10px;
 padding-bottom: 10px;
 }

By no means meant as the ‘be all’ and ‘end all’ of what is possible with Open Sans and CSS, but hopefully these five examples will give you a good jumping off point. Happy coding!