ElianCodes

← Back to blog

Published on 2023-03-01 19:41 by Elian Van Cutsem

Brutal: A theme for Astro

Brutal is a minimal neobrutalist theme for Astro. It’s based on Neobrutalist Web Design, a movement that aims to create websites with a minimalistic and functional design. It has some integrations like Image Optimization, RSS, Sitemap, ready to get your SEO done right.

Finally, I published my own website’s 2023 redesign as an Astro theme!

Getting started

# npm 6.x
npx create astro@latest --template eliancodes/brutal

# npm 7+
npx create astro@latest -- --template eliancodes/brutal

# pnpm
pnpx create-astro --template eliancodes/brutal

# yarn
yarn create astro --template eliancodes/brutal

That’s it! You now should have a fully functional theme!!

Technologies

UnoCSS

I recently got more in contact with UnoCSS and really love it. I decided to set it up with this theme, so more people can get easy access to using it without the hassle of setting it up. I also love the presets for utility-first classes and pureCSS icons!

Astro integrations

The theme includes some basics you need to setup a blog or general website. It will for example generate a sitemap for you, add an RSS feed from your blogposts and add image optimisations.

Written by Elian Van Cutsem

← Back to blog
  • 🍱 Brutal: A theme for Astro

    🍱 Brutal: A theme for Astro

    Brutal is a minimal neobrutalist theme for Astro. It's based on Neobrutalist Web Design, a movement that aims to create websites with a minimalistic and functional design. It has some integrations like Image Optimization, RSS, Sitemap, ready to get your SEO done right.

  • 🎤 Am I an international public speaker now?

    🎤 Am I an international public speaker now?

    A few weeks ago, I gave my first international keynote talk at JSWorld in Amsterdam. In this blogpost, I wanted to share some insights about the conference and my talk.

  • ✨ Building Blog tag index pages in Astro

    ✨ Building Blog tag index pages in Astro

    I wanted to add blog tag collection pages to my website. This way, people could filter on tags I used in my blog posts. Here is a guide on how I implemented it.

  • 🎉 I started from scratch (again)

    🎉 I started from scratch (again)

    I started rebuilding my personal website from scratch in Astro again, no dependencies, no frameworks, no nothing. This to decrease technical debt and make full use of the newer Astro features.

  • 💄 Implementing UnoCSS in Astro

    💄 Implementing UnoCSS in Astro

    UnoCSS is an atomic-CSS engine, designed with flexibility and performance in mind, I wanted to give it a try. Let's take a look at implementing it in Astro and see how it works.

  • ✨ 2022 - my year in recap

    ✨ 2022 - my year in recap

    2022 was a year that flew by so fast, I've gotten amazing opportunities and a lot of lessons learned. In this post, I put them all in a list.