Improving the Twentyseventeen theme with a dash of CSS

A bit of CSS can do so much!

Danilo Sierra
Jul 25, 2017 · 2 min read
squinting vs wow

I have been practicing tweaking Wordpress themes to be able to offer affordable web design for individuals starting their new projects. And luckily, most of the time you can do great magic with some simple css on the basic themes from wordpress. This, in my opinion, reduces the risk of choosing a crappy theme from an online market, and gives you a lot more freedom if you work with system fonts or web-based ones. Lets consider this little case an example.

By adding a bit of CSS i changed the normal install of the Twentyseventeen theme from Wordpress and made it look from this

Hi, I am the generic Twentyseventeen you already know

To this:

I AM A BRUTAL AND READABLE VERSION NOW

Basically all I did was choosing the css elements most frequently used and blowed them up a bit with some heavy duty em’s. They would be very readable even on mobile regardless of the platform, and they would be appealing as all the new system fonts are also quite beautiful.

Putting this code would do the magic.

body, a, h1, h2, h3, h4{
font-family: -apple-system, BlinkMacSystemFont,
"Segoe UI", "Roboto", "Oxygen",
"Ubuntu", "Cantarell", "Fira Sans",
"Droid Sans", "Helvetica Neue", sans-serif !important;
text-align: left;
letter-spacing: 0px !important;
}h1 {font-size: 4em !important;
text-transform: none !important
}
h2 {font-size: 3em !important;
text-transform: none !important;

}
h3 {font-size: 2em !important;
text-transform: none !important;
font-weight: 700 !important;
}
p, .textwidget {font-size: 1.5em !important
}

I hope this works nicely for your design needs. Feel free to recommend updates on the comment or this post’s github gist.

mimosa agency

mimosa is a Berlin-based integrated digital & creative agency founded by Camille Darroux and Danilo Sierra.

Danilo Sierra

Written by

I love photography, digital culture, reggaeton and brutalism. Marketing specialist and founder of https://mimosaagency.com

mimosa agency

mimosa is a Berlin-based integrated digital & creative agency founded by Camille Darroux and Danilo Sierra.

Welcome to a place where words matter. On Medium, smart voices and original ideas take center stage - with no ads in sight. Watch
Follow all the topics you care about, and we’ll deliver the best stories for you to your homepage and inbox. Explore
Get unlimited access to the best stories on Medium — and support writers while you’re at it. Just $5/month. Upgrade