🤖 Hello World – Beautiful Code #1

Hey everyone! It’s Marc 👋

Today, I'm starting this new adventure of creating a newsletter.

For those who don't know me, I'm Marc Taulé, a graphic designer and creative frontend developer. You can find me on Twitter / X building Supasnap.com in public and working on other side-projects.

The motivation behind this newsletter is to assist indiehackers, builders, web developers and entrepreneurs with beautiful website inspiration, resources and cool utilities that can inspire them or be used for their projects.

👀 What can I expect from the newsletter?

Every week, you'll receive:

😍 3 awesome websites for inspiration
🔨 3 tools that can help grow your products
🧰 3 resources that you can use in your projects
🤖 3 code snippets ready to be used in your projects
😂 1 meme to add a bit of humor to our world

I hope you enjoy it, and if you like it and want to support me, you can:

• Forward it to a friend and invite them to subscribe

• Share it on your social networks

• Join us to our Telegram channel

Or if you just want to say hello, reply to this email or write me on Twitter / X and let's talk!

🤩 Websites

1. Buttermax

2. Open Due

3. Monastik Suites

🔨 Tools

1. aiCarousels

Crafting visually engaging carousels for social media can be daunting for non-designers. Our user-friendly tool simplifies the process, allowing you to boost your online presence without design expertise, while AI helps you write the content.

2. DocuWrite.ai

Automated AI-powered tools to generate Code & Api documentation from your source code files.

3. Toggl

Time tracking software to drive every decision.

🧰 Resources

1. Animista

On-demand CSS animation library. Configure which animation you want and export it to CSS code.

2. Park UI

A component library that lets you choose the JS/CSS framework you want.
Park UI put you in control allowing you to decide how the components are built and styled. Park UI provides a set of components with sensible defaults that can be easily customized to fit your needs.

3. SVG Repo

A 6000+ free SVG vectors and icons collection for commercial use. You can choose the desired style of vector collections: Monocolor, multicolor, duotone, outlined, filled, icon, glyph, rounded and sharp.

🤖 Code and snippets

Here you will find code snippets from CodePen that you can use in your projects and adapt to your needs.

1. Card :hover spotlight effect with background-attachment 

An awesome hover effect on a card using CSS and very little Javascript.
Author: Jhey

2. Bouncy image radio group

Clickable buttons from radio groups with a Bouncy effect using only CSS. You can use it with images or other elements like videos.
Author: Adam Argyle

3. Filtered list with :has 

Filtered card list based on radio buttons. You can also modify the layout and activate the dark theme. And all with just CSS using the new :has property! 🤩
Author: Ryan Mulligan

😂 Humor

“When frontend is ready before backend”

That's all for today. I hope you enjoyed the content, and see you next week! 👋

Cheers!
Marc