DEV Community

Cover image for 🎩 Console Magic - Render CSS, SVGs & HTML in Your Console
Adam Marsden
Adam Marsden

Posted on

🎩 Console Magic - Render CSS, SVGs & HTML in Your Console

Hey everyone ✌️ Here's a quick look at this week's newsletter:

✨ CSS Blurry Shimmer Effect & Beyond

🚀 7 CSS Blunders to Avoid in 2024

🎨 Daily UI Challenges

Enjoy this week's edition 👋 - Adam at Unicorn Club.


Sponsored by Techpresso

Keep up with AI and Tech in 5 mins

Get the most important AI and tech news in a free daily email. Join 50,000+ professionals from OpenAI, Meta, Google...

Join for Free


🧑‍💻 Dev

console.delight

Did you know you could render (limited) CSS, SVGs, and even HTML in it?!? I didn’t!

CSS Blurry Shimmer Effect

Box shadows are fairly straightforward in CSS: declare the box-shadow property, set the shadow offsets, define the spread, and give it a color.

7 Common CSS Mistakes Junior Frontend Developers Make

And how to fix them...

5 CSS snippets every front-end developer should know in 2024

I believe every front-end developer should know :has() is more than a "parent selector", the how and why of a subgrid, how to nest with built-in CSS syntax and more.

Big, beautiful, beefy focus states with :focus-visible

One thing I love about the new’ish :focus-visible pseudo-state is that it allows me to create bigger, bolder, and more obvious focus states.

🎨 Design

How should designers code?

You can be a successful designer either way, but I personally believe that software is never built with more attention to detail than when it’s coded by the person who designed it.

Master UI/UX Design with Daily UI Challenges

Advance your UI/UX skills with daily challenges, achievement streaks, and personalized feedback coming soon.

Improve Your Logo Design Skills

So what makes the Master's logos so timeless? So solid? So beautiful? And how can I learn from their work?

🔥 Promoted Links

Share with 2,000+ readers, book a classified ad.

TLDR - Keep up with Tech in 5 minutes

Get the most important tech news in a free daily email. Read by +1,250,000 software engineers and tech workers.

Sentry image

See why 4M developers consider Sentry, “not bad.”

Fixing code doesn’t have to be the worst part of your day. Learn how Sentry can help.

Learn more

Top comments (0)

Billboard image

The Next Generation Developer Platform

Coherence is the first Platform-as-a-Service you can control. Unlike "black-box" platforms that are opinionated about the infra you can deploy, Coherence is powered by CNC, the open-source IaC framework, which offers limitless customization.

Learn more

👋 Kindness is contagious

Please leave a ❤️ or a friendly comment on this post if you found it helpful!

Okay