Julz

Julz

@julzmon.bsky.social

40 followers343 following35 posts

Julz reposted

To target multiple classes with the same prefix, you'd typically have to resort to brittle attribute selectors. To make things easier, CSS is getting a new selector: the “Class Prefix Selector” (`.foo-*`). Check brm.us/class-prefix... to get the details. (Browser Support: None 😛 — just resolved!)

brm.usThe Future of CSS: Target Multiple Classes with the Class Prefix SelectorTo target multiple classes that share the same prefix, you'd typically have to resort to brittle attribute selectors or add extra base classes to your markup. To make things easier, CSS is getting a n...

Julz reposted

Beyond “originally pitching this” which the article cites as my only involvement, I also put a fair bit of effort into driving this resolution at the recent Berlin F2F, together with @tabatkins.com. I’m *delighted* we convinced the WG to do it. It will be a gamechanger for CSS utility classes! 🎉

Bramus@bram.us

To target multiple classes with the same prefix, you'd typically have to resort to brittle attribute selectors. To make things easier, CSS is getting a new selector: the “Class Prefix Selector” (`.foo-*`). Check brm.us/class-prefix... to get the details. (Browser Support: None 😛 — just resolved!)

Julz reposted

Is the era of design-tool lock-in ending? 🧵 Imagine a world where the Design System is the source of truth, and Figma, Penpot, or Sketch are just interchangeable "editors" with two-way sync to code. Pipe-dream or the next logical step for UCD & AI? Thoughts?? community.penpot.app/t/is-the-des...

community.penpot.appIs the design tool becoming irrelevant in the age of AIHey everyone! 👋 I’ve recently been tasked with auditing and exploring the intersection of Design and AI at my workplace. I’m looking at this holistic landscape through the lenses of our User-Centred ...

Julz reposted

I'm literally doing this as we speak, laying the foundations of another theme-driven design system build at @set.studio In previous attempts we've done things well and made lots of mistakes so the more we learn from that and develop the foundations of a more formalised methodology, the better.

Piccalilli@piccalil.li

CSS frameworks are all fun while a project is greenfield, but after that, it's rarely the case. Leaning heavily on his experience as a CSS consultant fixing this exact problem, @bell.bz gives solid advice in this free lesson from Complete CSS. piccalilli.link/cc-free-less...

Julz reposted

I’m excited to share a new project from Adobe Spectrum Web Eng that tracks support for #CSS features within and across the shadow DOM. The goal is to provide visibility into feature parity and outstanding issues. We hope you find it useful - open to contributions! shadow-dom-css.adobe.com

shadow-dom-css.adobe.comModern CSS Feature Support For Shadow DOMTracking the state of support for CSS features within and across the shadow DOM to provide visibility into feature parity, usage details, and outstanding issues and bugs.

Julz reposted

I shared some thoughts on handling breaking changes in design systems for @zeroheight.com. A bunch of lessons learnt from my time leading design systems at Spotify.

Oliver Lindberg@oliverlindberg.com

How do you approach breaking changes in a design system without causing chaos? 🤔 In this post, @shaunbent.co.uk covers 7 elements he found most valuable when building a strategy around breaking changes, sharing lessons from leading #designsystems at Spotify. Read it on the @zeroheight.com blog:

Julz reposted

Can you make toast messages accessible? Last week I posted about how Github’s design system banned toast messages because they’re hard to use and inaccessible. I received 135 comments, including pushback from accessibility specialists who insist that toast messages can be made accessible.

Julz reposted

🎉 Just published: a new Design Tokens article 🎉 Create consistent utility classes directly from design tokens for both flexibility _and_ consistency. Generating Utility Classes from Design Tokens using Style Dictionary www.alwaystwisted.com/articles/a-d... 🙏🖤 #DesignSystems #DesignTokens #CSS

alwaystwisted.comGenerating Utility Classes from Design Tokens using Style DictionaryGenerate Utility Class CSS from design tokens using Style Dictionary for seamless design-to-development workflows and collaboration and snowflakes.

Julz reposted

There's a new #CSS Working Group poll to get feedback on different names for the infamous 'Pinterest' layout. - Since it uses many of the grid-* properties, `grid` will be in the name somewhere - We don't use metaphors in CSS names, so `masonry` is not listed here docs.google.com/forms/d/e/1F...

docs.google.comEx-Masonry Display Type Keyword PollSee https://github.com/w3c/csswg-drafts/issues/12022 for context. This poll intentionally leaves out `masonry` as an option, see https://github.com/w3c/csswg-drafts/issues/12022#issuecomment-34172962...

Julz reposted

Today's lunch video is "Cascading Layers of !mportance" - "Cascade Layers are now widely available, with the potential to fundamentally change how we think about the cascade and how we collaborate across design systems, component libraries, & third-party tools." #CSS www.youtube.com/watch?v=4Pkh...

youtube.comCascading Layers of !mportance - Miriam Suzanne | JSHeroes 2025The Cascade is the underlying algorithm that applies our styles the web, and a main target of frustration when our styles go bad. But why is it there, how is it changing, and why should we care?…

Julz reposted

This is a powerful browser DevTools hack 💡 You can get a full overview of any website’s CSS design system like colors, fonts, contrast issues, media-queries and more! Watch the video for a quick demo 🎥 Follow @rammcodes.bsky.social for more 💎 #html #css #javascript #reactjs #100daysofcode

Julz reposted

Julz reposted

I should have been doing other things, but someone asked about selecting the last row in an auto grid and it sent me down a rabbit hole, but got it working. The codepen is pretty heavily commented to try and explain how it works, and I will be making a video eventually. codepen.io/kevinpowell/...

Julz reposted

I set out to announce two web components I wrote for displaying @bsky.app likes and ended up ranting about how painful it is to build accessible, localizable web components in 2025. The components are still there, though — lucky you? lea.verou.me/blog/2025/bl...

lea.verou.meBluesky Likes Web Components • Lea VerouI set out to announce two components I wrote for displaying Bluesky likes and ended up ranting about the pain of building accessible, localizable web components in 2025. The components are still here,...

Julz reposted

Such an exciting day. I proposed if() last year and got CSS WG consensus to add it to the spec on my birthday (!) last June. Now, less than a year later, it ships in the most widely used browser. I think it can be a game changer for design systems, especially together with ident() & revert-rule.

CSS if() function landed today(!!!) in Chrome 137 🥳 along with another rad feature: reading-flow 🥳 So I put together a quick video showcasing both: youtu.be/Apn8ucs7AL0

Julz reposted

Update: She’s here!

DIANA@diana2.bsky.social

The best thing about having a store set up already is that I just made this in five minutes and ordered it for myself #figma

Disappointed #figma still didn't release relative units. New features feel half backed. Draw adds some value but now people have to be careful not to export giant SVGs, would be nice if they added export size estimation.

Julz reposted

Have you ever tried to remove margins from content with `:first-child { margin-block-start: 0; } :last-child { margin-block-end: 0; }` only to feel icky, knowing the code is fragile, just waiting for the layout to break with different HTML? Try `margin-trim` instead. webkit.org/blog/16854/m...

webkit.orgEasier layout with margin-trimIf you write a lot of CSS, you are familiar with those moments when you aren’t quite sure how to accomplish what you want to accomplish.

Julz reposted

📢 The Internet Archive needs your help. At a time when information is being rewritten or erased online, a $700 million lawsuit from major record labels threatens to destroy the Wayback Machine. Tell the labels to drop the 78s lawsuit. 👉 Sign our open letter: www.change.org/p/defend-the... 🧵⬇️

Julz reposted

I have a new article out: 🎇 Pure CSS Halftone Effect in Only 3 Declarations 🎇 frontendmasters.com/blog/pure-cs... This goes through the how behind the 3 declarations and then explores a lot of variations that help us produce 🌟 cooler, more interesting 🌟 patterns. #CSS #pattern #gradient #halftone

frontendmasters.comPure CSS Halftone Effect in 3 Declarations – Frontend Masters BoostA halftone is a pattern of dots that vary in size and spacing. It's a printing technique that you normally don't see, but blown up in size, is a cool aesthetic. This is a deep dive on how it can be do...

Julz reposted

🚀 [Case study] Context Chips in Survey Design: “Okay, but how does it feel?” This is about one of the novel UIs I designed when leading #StateOfHTML 2023 — the one I’m most proud of. 💙 Been meaning to write this for over a year, finally found time during this break! lea.verou.me/blog/2024/co...

lea.verou.meContext Chips in Survey Design: “Okay, but how does it feel?” • Lea VerouThe story of how a weird little UI to collect sentiment alongside survey responses defied constraints and triumphed over skepticism through usability testing.

Julz reposted

After 15+ years of teaching, architecting & delivering CSS for global organisations & startups, I’ve collated that experience into an extensive course. Complete CSS has taken nearly a year to produce and finally, it’s officially live for a limited Black Friday launch price of £189 complete-css.com

Julz reposted

This article by @ericwbailey.website on @piccalil.li is incredibly useful. It’s exactly how I prefer CSS articles to be written: starting with a problem, including clear illustrations, and offers a practical solution. Highly recommended 💯 piccalil.li/blog/making-...

piccalil.liMaking content-aware components using CSS :has(), grid, and quantity queriesEric Bailey teaches us how to make a hyper-resilient component that responds not only to the container, but other languages too.