'Allo!

This week I had the honor of speaking at LondonCSS all about Style Stage. If you missed it, here's the tweet with all the relevant links.

If you haven't yet contributed, consider preparing to make your stylesheet in October to count it toward your Hacktoberfest PRs!

There are now 34 styles available - go check them out!

🚨 Updates

An alternate CodePen starting point is now available - the Style Stage Skeleton Starter Stylesheet.

If you've been interested in contributing to Style Stage but were having difficulty getting started, this may be the jumping-off point that will help!

---

Recently Added Styles

Hmm, there seems to be a theme here!

• Retro Cyberpunk By Inès K.
• Retro Modern By Mike Aparicio

---

CSS Tip: Turn up your 8px grids to the max()!

😴 Tired: margin: 16px 32px;

☕️ Wired: margin: max(16px, 8vh) max(32px, 8vw);

Using max(), the margin can responsively expand but never shrink below the px value.

Here's a CodePen showing a practical instance where this may be useful which is a dashboard type of scenario (and also uses CSS variables + calc() instead of px).

If you also want to cap how much it can grow, you can alter this to use clamp() instead:

margin: clamp(16px, 5vh, 40px) clamp(32px, 8vw, 64px);

---

Weekly Link Roundup

Here’s some links you may have missed:

• Cassie Evans' links from LondonCSS
• Adam Argyle's links from LondonCSS
• Alex Russell did a performance test using content-visibility
• Bernd Artmüller helped show how to use a fix for the 100vh bug
• 📺 Una's new episode of "Designing in the Browser" covering accessible color

---

Keep it .class-y,
Steph • @5t3ph