Enhancing The UI
Time to spice up the plain text a bit. With typography, spacing, and color now in place, it’s time to introduce a few essential UI elements. The main theme throughout this is probably roundness, since all of the components got rounded corners.
Images
In the previous posts, most images had white backgrounds. As such, they don’t really look aesthetically pleasing on the new, black background. To better the visual experience, I’ve added a border and a background.
Icons
After looking at a few popular icon sets, I decided to go with ionicons, filled variant. Their smooth curves and filled shapes fit well with the rounded aesthetic and complement both the typeface and overall tone of the site.
Buttons
I had some fun with this one! I started with a simple, flat button, but ended up layering a gradient with six shadows. The result feels tactile — almost like pressing a real button.
Archive
A simple ordered list has served me well so far, but as the list grows, a clearer layout helps readers scan and find specific posts more easily. I also added publish dates for context.
A full style guide with all of the design tokens and components is in the works. I’ll update this post once it’s live. Stay tuned.
❧