Snippets

Browse snippets

Concise code fragments to solve discrete challenges.

• Fluid Typography and Spacing with clamp()

  clamp(min, preferred, max) — with a preferred value built from rem plus a viewport or container-relative unit — scales font-size, padding, and gaps continuously between a floor and ceiling instead of jumping at fixed breakpoints, replacing a media-query ladder with one line per property.
  Category: CSSLast modified: September 2026

• min(), max(), and clamp() — CSS's Value-Bounding Functions

  min(), max(), and clamp() pick the smallest, largest, or a bounded value from a list of CSS expressions at the point of use, replacing media-query-driven overrides for readable measures, safe-area-aware insets, and bounded widths with one declaration each.
  Category: CSSLast modified: September 2026

• Padding Around the Notch with env()

  The env() CSS function reads environment variables the browser defines outside your stylesheet — most commonly the four safe-area-inset-* values — letting fixed/sticky content pad itself around a device's notch, home indicator, or rounded corners without hardcoding per-device pixel values.
  Category: CSSLast modified: September 2026

• One-Line Theme-Aware Colors with light-dark()

  The light-dark() CSS function collapses a light value and a dark value into one declaration, resolved by color-scheme — no duplicate custom properties, no @media (prefers-color-scheme) block per themed property.
  Category: CSSLast modified: September 2026

• Exponential Backoff with Jitter

  Enhance your retry logic with 'Full Jitter' to decohere client requests and protect your infrastructure during recovery.
  Category: JavaScriptLast modified: September 2026

• Exponential Backoff Retry Utility

  A production-ready recursive utility to retry failed asynchronous operations with a configurable delay that doubles and caps to prevent infinite wait times.
  Category: JavaScriptLast modified: September 2026

• The Holy Grail Layout (Grid Edition)

  Build the classic Holy Grail layout using modern CSS Grid — a clean, responsive header, sidebars, main content, and footer without floats or layout hacks.
  Category: CSSLast modified: July 2026

• Encapsulation with Private Class Fields

  Implement native engine-level privacy in your OOP structures using ES2022+ private class fields and memory-efficient prototype methods.
  Category: JavaScriptLast modified: July 2026

• Encapsulation with Closures

  Master the functional approach to data encapsulation in JavaScript by leveraging lexical scoping to create immutable private variables.
  Category: JavaScriptLast modified: July 2026

• Deep Freeze Objects in JavaScript

  Lock objects and their children immutably — prevent accidental mutations and enforce deep immutability in strict mode.
  Category: JavaScriptLast modified: July 2026