DEV Community

T.
T.

Posted on

Colors, Fonts, and Chaos: CSS Blogging

Getting started

This weekend I started working on setting up a blog website using the site generator called Deadlogs. I chose this site generator since it is based on HTML and CSS. There are Javascript elements used for the navigation and pagination, but overall it allows me to make and update a static site without needing much Javascript.

I chose the Wheat template because I liked the cool floral geometric patterned background image, the transparent gray border for posts, and the simple fonts used.

The original Wheat Deadlogs template

Downloading the template package from Github was simple.

Then I edited a pink and gray patterned background online. I am obsessed at the moment with the Inter font from Google Fonts. It looks smooth and makes my writing feel very organized. I chose Inter for the main site text.

Choosing Fonts

For my pink header, I used Momo Signature. It's a cursive font that reminds me of Monotype Corsiva, a cursive font that was popular back in the day.

Selecting Colors

Pink is one of my favorite colors. So I used for #fb52a7 for accent color (links), hot pink for titles and headers, and #012410 a dark green for my main text color. And I kept the original template's gray color for the background on the main content area.

What's Next?

Next up, I plan to add content for my pages. I'll share an update soon with those next steps!

Talk to me

Do you use static site generators? What is your favorite static site generator? Share your sites in the comments.

Top comments (0)