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

Adam Marsden - Oct 2 - - Dev Community

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.


๐Ÿ“ฌ Want More? Subscribe to Our Newsletter!

Get the latest edition delivered straight to your inbox every week. By subscribing, you'll:

  • Receive the newsletter earlier than everyone else.
  • Access exclusive content not available to non-subscribers.
  • Stay updated with the latest trends in design, coding, and innovation.

Don't miss out! Click the link below to subscribe and be part of our growing community of front-end developers and UX/UI designers.

๐Ÿ”— Subscribe Now - It's Free!


Sponsored by 20iยฎ

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 optimising 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 โ†’

๐Ÿ”ฅ Promoted Links

Share with 2,500+ readers, book a classified ad.

Stand The F*ck Out

Everyone says stand out, but how? Subscribe to my daily (Mon-Fri) emails and get advanced positioning, branding, & lead gen tips

Keep up with AI & Tech in 5 minutes

Get the free daily email with the most interesting tech news and insights. Read by 100,000+ professionals from Apple, OpenAI, Nvidia, and more...

Support the newsletter

If you find Unicorn Club useful and want to support our work, here are a few ways to do that:

๐Ÿ“จ Recommend friends to subscribe

๐Ÿ“ข Sponsor or book a classified ad

โ˜•๏ธ Buy me a coffee

Thanks for reading โค๏ธ

@AdamMarsdenUK from Unicorn Club

. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .