1. Fluid type with clamp()
No more 15 media queries for font sizes:
h1 { font-size: clamp(2rem, 5vw, 4rem); }
2. Stable scrollbar
Stop the layout jump between short and long pages:
html { overflow-y: scroll; }
3. Custom properties for theming
:root { --bg: #fff; --ink: #111; }
[data-theme="dark"] { --bg: #111; --ink: #fff; }
body { background: var(--bg); color: var(--ink); }
4. object-fit for images
img { object-fit: cover; width: 100%; height: 100%; }
5. Scroll margin for anchors
[id] { scroll-margin-top: 80px; }
Five lines of CSS, endless headaches saved.