🚙 Out of the office – Beautiful Code #44

Next week I’m taking a few (much-needed!) days off and I’ll be out for 3 weeks, so I won’t be sending the newsletter during that time — but once I’m back, you’ll start receiving it again as usual 😃

Author

Marc Taulé
July 10th, 2025

Hey! It’s Marc 👋

How are you?

Next week I’m taking a few (much-needed!) days off and I’ll be out for 3 weeks, so I won’t be sending the newsletter during that time — but once I’m back, you’ll start receiving it again as usual 😃 

I think it’s important to disconnect every now and then to reset, clear your mind, and come back stronger. I hope you also get the chance to take some time off, relax, and disconnect from work!

See you in a few weeks, but in the meantime, here’s this week’s content!

If you're new here, let me quickly explain what Beautiful Code is all about. 👇

What can I expect from Beautiful Code?
Every week, you'll receive:
😍 3 awesome websites for inspiration
🔨 3 tools and resources that can help grow your products
🤖 3 code snippets ready to be used in your projects
😂 1 meme to add a bit of humor to our world

Hope you have a great rest of the week!

Before we continue I want to remind you that you can support Beautiful Code buying me a coffee ☕️ I love good coffee! 😍

😍 Websites

1. Q.One Ease Tomorrow

2. FRA! - Doodle Designer

3. Homerun

🔨 Tools & Resources

1. Fliiipbook

FliiipBook is a simple, web-based GIF animation app. It lets you draw frame-by-frame animations directly in your browser, with features like onion skinning, undo/redo, brush sizes, textures, timeline navigation, and one-click GIF export. Designed to be playful and fast, it helps you create fun, looping 24-frame animations with ease.

2. SVG to CSS

SVG to CSS by CSS Generators is a free online tool that converts your SVG code into CSS background-image syntax. Just paste your SVG, and it generates a CSS-ready, URL-encoded string you can use directly in your stylesheets — perfect for embedding vector graphics as CSS backgrounds easily and efficiently.

3. Dark

Dark Design is a curated gallery of beautiful, dark-themed websites for inspiration. It showcases a variety of modern, elegant, and creative web designs that use dark color schemes effectively, making it a useful resource for designers looking to explore or implement dark UI patterns.

🤖 Code and snippets

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

1. Liquid Glass Switcher

2. Advanced Menu Trigger Animations

3. Aura Button Effects

Author: Nodws

😂 Humor

Benefits of using TailwindCSS 🤭 

.

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

  • You can support me by buying me a coffee ☕️

  • Forward it to a friend and invite them to subscribe

  • Share it on your social networks

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

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

Cheers!
Marc