• Beautiful Code
  • Posts
  • ๐Ÿ‘จโ€๐Ÿ’ป Working โ€“ Beautiful Code #56

๐Ÿ‘จโ€๐Ÿ’ป Working โ€“ Beautiful Code #56

No personal updates this week, just work, work and more work โ€“ just a bunch of interesting websites, tools, resources and code snippets for you! I hope you enjoy with it this week ๐Ÿ˜Š

Hey! Itโ€™s Marc ๐Ÿ‘‹

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

No personal updates this week, just work, work and more work โ€“ just a bunch of interesting websites, tools, resources and code snippets for you! I hope you enjoy with it this week ๐Ÿ˜Š

Before you continue I want to remind you that you can support Beautiful Code buying me a coffee โ˜•๏ธ I love good coffee! ๐Ÿ˜

๐Ÿ˜ Websites

1. Iventions

2. More Nutrition

3. Anuc Home

๐Ÿ”จ Tools & Resources

1. SpoilerJS

SpoilerJS is a lightweight, frameworkโ€‘agnostic web component that adds stylish spoiler text effects inspired by Telegram. You can wrap your content in a custom tag such as <spoiler-span> and the text remains hidden until clicked. When revealed, a particle animation covers the text and then clears away, producing a playful yet accessible UI effect. It works out of the box across frameworks like React, Vue, Svelte, or even plain HTML with no dependencies.

2. OG Image Generator

ogImage.click is a free online tool designed to help you generate professional Open Graph images, Twitter/X headers, and blog cover art in seconds. It offers a range of clean templates, full customization of backgrounds, logo uploads, grid overlays and gradients, and allows export in PNG, JPEG, or WebP formatsโ€”all without requiring an account or signโ€‘up. Itโ€™s ideal for content creators and marketers who want to elevate how their links appear when shared on social media.

3. Mirrow

Mirrow is a command-line compiler that turns ergonomic .mirrow source into production-ready SVG. The reference on the left catalogues every element Mirrow understands, but you can experience the workflow in seconds with a single command.

๐Ÿ‘‰ Check it out

๐Ÿค– Code and snippets

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

1. Grainy abstract images with SVG

Author: Ana Tudor

2. Pill Stepper

Author: Jon Kantner

3. Liquid Glass Apple

Author: Witters

๐Ÿ˜‚ Humor

Website is done! ๐Ÿคช 

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