← Back to Newsletters

🦄 11 New CSS Features, Design System Hacks & PayPal's Brand Refresh (5-min read)

October 2, 2024

Hey 👋

Grab your ☕ because this week's Unicorn Club is packed with goodness.

We're diving deep into 11 fresh CSS features, uncovering design system secrets, and even exploring PayPal's brand new look.

Plus, learn how to defer offscreen images like a pro and discover a curated collection of A/B test results.

Enjoy this edition 😌 - Adam at Unicorn Club.

20i® Next-Gen WordPress Hosting

The first Managed WordPress Hosting you’ll love, the last you’ll ever need. Blazing-fast cloud platform with integrated staging, cloning, Edge Cache, backups, CDN & WP Manager – no plug-ins required.

Try it now

🧑‍💻 Dev

11 New Features and Functions Arriving in CSS

On September 13, 2024, the CSS Working Group released the first Public Working Draft for the CSS Values and Units Module Level 5

Split Effects with no Content Duplication

This demo needs a single HTML element (input[type=range]), less than 20 CSS declarations (and that’s with having to duplicate a bunch of them for the -webkit- and -moz- cases) and under 100 bytes of JS (without even bothering to minify it).

Design System Tips from Developer’s Point of View

Developers and designers often have to iterate too rapidly to reach bicycle-level reliability, but the intuitive experience of a user logging onto your app as if they were hopping on a bicycle is still something we should aim for—and design systems are the best way to do so.

How to Defer Offscreen Images and Background Images

Deferring offscreen images is a web performance optimization technique that can help you improve user experience and Core Web Vitals on your site.

🛰️ Fun Fact

Image Optimisation: A Space Race Legacy - Believe it or not, techniques for optimizing image file sizes have roots in the space race. NASA's Jet Propulsion Laboratory developed image compression algorithms in the 1960s to transmit images from space probes back to Earth, laying the groundwork for modern image optimisation techniques.

🎨 Design

Documenting design process with Notion

A well-structured, comprehensive system for documenting your design work can save you time and nerves, ensure alignment across your team and beyond.

abtest.design

Curated collection of A/B test results from best-in-class apps

PayPal - Brand Identity

PayPal's new refreshed brand identity marks the next chapter for PayPal in the lives of its customers and signals a new direction for the business and the brand: one that is simpler, cleaner, more modern and more optimistic.

🗓️ Upcoming Events + Exclusive Deal

Check out these events. We've partnered with React Advanced to get you 10% off hybrid tickets!

🧑‍💻 The Biggest React Conference in the US

November 19-22 - Remote • New York

React Summit US is an in-person and remote first (hybrid) conference of all things React, gathering OSS authors, top trainers and speakers, as well as web engineers across the globe to meet in New York and online.

10% off for hybrid tickets. Code UNICORN

See event →

🟨 The main JS conference in the US

November 18 & 21 - Remote • New York

50+ stellar thinkers, shaping JS’s future 700 explorers, immersed in dev discovery 10K devs, connected worldwide

10% off for hybrid tickets. Code UNICORN

See event →

🧠 STHLM Xperience Conference

Nov 14 - Remote • Stockholm

The STHLM Xperience Conference is a yearly UX event, featuring expert talks, interactive workshops, and the latest UX trends. Connect with industry leaders, boost your skills, and explore innovative UX solutions in one day lively gathering.

See event →