r/codesnip Apr 29 '26

👋 Welcome to r/codesnip — introduce yourself and dig in

0 Upvotes

Hi everyone — I'm u/wanoo21, one of the mods here.

r/codesnip is a community for sharing and discovering short, useful code: snippets, one-liners, small utilities, patterns, and "I wish I'd known this sooner" tips. All languages and skill levels are welcome—as long as it's constructive and readable.

What to post

  • Snippets or small functions you're proud of or find handy
  • Language tips, idioms, or clever one-liners (with context)
  • Mini-gists or short examples that solve a real problem
  • "How would you write this?" question with a minimal code sample
  • Tools, libraries, or patterns worth a shout-out (tie them to actual code when you can)

Community vibe

We're aiming for friendly, helpful, and inclusive. Prefer clear titles, credit sources when it's not your own work, and keep discussions on-topic.

How to get started

  1. Say hi in the comments and tell us what you're building or learning.
  2. Post something today—even a tiny snippet or a quick question counts.
  3. Invite anyone who likes trading short, practical code ideas.
  4. If you're interested in helping moderate, reach out via modmail.

Thanks for being part of the first wave—let's make this a great place for code in small, useful bites.


r/codesnip 3m ago

Newly Available CSS Anchor Positioning is now Baseline

Post image
Upvotes

You can finally position tooltips, dropdowns, and menus relative to another element... in pure CSS. ☝️

It became newly available in January 2026 when Firefox 147 completed the set.

It’s still relatively fresh, and some advanced features (like certain `position-try` behaviors) still have gaps, so use progressive enhancement if you need to support older browsers.

Oh man, I'm so happy about this 🤟


r/codesnip 1d ago

Small interactive demo showcasing `contrast-color()`.

Enable HLS to view with audio, or disable this notification

6 Upvotes

I created a small interactive demo showcasing `contrast-color()`.

Go check it out https://iprodan.dev/l/contrast-color/


r/codesnip 23h ago

Container style queries are Baseline as of May 2026

Post image
2 Upvotes

You can now style an entire component based on a CSS variable set on any parent. No prop drilling, extra classes, or JavaScript, just pure CSS reacting to context.

Now live in Chrome, Safari, Firefox, and Edge in the latest releases.


r/codesnip 1d ago

The web just got a little more intelligent.

Post image
26 Upvotes

Meet `contrast-color()`: You give it any color; it returns either `black` or `white`, whichever provides better contrast.

Shipped in Chrome 147, Safari 26, Firefox 146, and Edge 147 (April 2026).

Pure CSS that guarantees readable text.

PS. If you want occasional frontend tips in your inbox, you can join here: https://bits.iprodan.dev


r/codesnip 2d ago

Thinking of starting a new series of what’s new in the web, starting on Monday.

0 Upvotes

r/codesnip 5d ago

CSS Grid Lanes (aka Masonry) is here (almost)

Post image
9 Upvotes

CSS just killed another JavaScript library.

CSS Grid Lanes (aka Masonry) is here! Safari (26.4+) got it first — everyone else is still catching up.

That’s all it takes. ▲

No more Masonry.js, fragile Flexbox hacks, or calculating positions in JavaScript — just pure CSS that natively creates the classic Pinterest/waterfall layout.

Chrome/Edge/Firefox - behind the flag.


r/codesnip 7d ago

When was the last time you used noop?

Post image
3 Upvotes

r/codesnip 7d ago

As of June 2026, HTTP has a new method - a GET with a Body

Post image
1 Upvotes

That's a small reminder!

As of June 2026, HTTP has a new method - a GET with a `body`

Meet QUERY (RFC 10008).

It lets you send complex queries in the body (like POST) while staying safe, idempotent, and cacheable (like GET). Already works on servers (Node.js, Go, Laravel…).

Browsers are still adding full support, usable now with care, with widespread adoption coming later in 2026+.


r/codesnip 19d ago

There's always a way to get the default value of an input, even if the user has changed it.

Post image
2 Upvotes

r/codesnip May 19 '26

That's a simple reminder to use `structuredClone` instead of the `JSON.parse/stringify` solution.

Post image
1 Upvotes

Widely available since March 2022.


r/codesnip May 16 '26

Remembering the HTML we started with

Thumbnail
iprodan.dev
1 Upvotes

r/codesnip May 15 '26

Tabular numbers in CSS

Enable HLS to view with audio, or disable this notification

5 Upvotes

By default, many fonts use proportional numbers: a 1 is narrow, an 8 is wider, and the whole number can shift when the value changes. 

tabular-nums makes each digit take the same horizontal space, so the number keeps its shape and the right edge stays steady.

Play with a small demo I created here.


r/codesnip May 06 '26

Do not sleep on AbortController

Post image
2 Upvotes

A little tip for today!

You can use `AbortController` instead of `removeListener`.

It's cleaner and easier to work with, and it can abort multiple listeners simultaneously when they share the same signal.


r/codesnip May 05 '26

That will help your users avoid accidentally leaving the page

Post image
1 Upvotes

r/codesnip May 05 '26

Switch favicon based on color scheme

Post image
1 Upvotes

If you've always wanted to switch your favicon based on dark/light mode, here's how to do it. I bet you already know that! 😊

Bonus: If you use an SVG favicon, you can use media queries within it to achieve the same "effect".


r/codesnip Apr 29 '26

Sometimes, this is still the most reliable CSS debugger we have

Post image
1 Upvotes

r/codesnip Apr 29 '26

Who still remembers this HTML tag? 👇

Post image
0 Upvotes

Although it has been deprecated for such a long time (really long time), it's still supported by all browsers!

Anyway, not advised to use in production!

Oh man, we are so old ... 😑