Version 1.1
This is a serious attempt to create the perfect text format for readability.
- Demo - JSFiddle
- Demo - JS Bin (works on mobile)
- Neutral feeling, not branded in any way.
- The most common content tags are supported.
- Perfect balanced colors for eye comfort.
- Maximum readability because of perfect font families, letter spacings and line heights.
- Maximum scanability because of perfect spaces between elements (paddings/margins).
- Maximum responsiveness because of fluid font sizes.
If you disagree, add an issue.
- Download the css file
- Add
<link rel="stylesheet" href="assets/css/dist/style.min.css">to your head. - Create
<div class="format-text"></div>and add some content. - Done!
If it does not work as expected, your other styles are probably overwriting the styles of this file.
a b blockquote br cite code i img em h1 h2 h3 h4
li ol p pre strong table td th ul
It's probably debatable, but I think it is. Take away everything that has to do with branding. What do we have left? Readability!
- Is a font size of 16px more readable than 10px? Yes!
- Is the color #333 more readable than #ccc? Yes!
Fine tune every little value like this and we will eventually get the perfect text format. For readability that is, not for brandning.
- They are common and free
- They are beautiful and are placed on a fast CDN
- It's possible to download them and host them yourself if needed
- I don't need to host the fonts with the repo
Bootstrap and other frameworks has a lot of stuff. Most of the things is not needed. This repo only covers the things that has to do with the text content.
Donate to DevoneraAB if you want.
MIT