Design Specs
Typeface
Headings
GarnettParagraph
GeorgiaType | Font Size ( In Pixels ) | Weight | Line Spacing ( In Pixels ) |
---|---|---|---|
H1 | 42 | 500 | 52.5 |
H2 | 40 | 800 | 56 |
H3 | 24 | 800 | 33.6 |
H4 | 18 | 800 | 28.8 |
Paragraph | 19 | 500 | 30.4 |
Color
Heading
2F2F30Paragraph
2F2F30Link Hover
5200FFArticle Hero
Slite has a clean, focused article hero section.
The headline feels loud and clear, supported by a humongous featured image.
They use the article's meta as the lede, which gives the gist of the article in a really, really crisp manner.
Article Body
Slite has a minimal article body design, with content aligned to the left and a sidebar sporting a mail signup box.
Blog Imagery
Featured Image
For this article, Slite has used a combination of illustration and text for their featured image.
If you browse through their content library, you'd find that they use a variety of featured images. They don't stick to a particular template.
The only thing that is consistent here is the use of hand-drawn styled illustrations.
In-content Images
Slite heavily uses their product's images to demonstrate its features that sync with the content.
They either use static images or GIFs.
For third party content or screenshots, they add those images in their templates with a logo at the right corner to maintain consistency.
Email Subscription
Slite has done an excellent job with email subscription box. They have chosen to keep it non-intrusive, minimal and focused. The best part? There are no annoying pop-ups that scream to sign up for their newsletter.
What We Like
The best part about Slite's blog design is it is highly focused. Zero distractions.
All of the other stuff like related articles, call to action, social sharing buttons (which appear only at top) have been pushed down.