Video wird geladen...
Video konnte nicht geladen werden
To get translucent menus right, we had to manually test components over different gradients & colors, checking visuals & accessibility. Now multiply that by 5 component types across 5 styles in both light and dark modes. It's a lot of work. Work that, for now, AI can't do.
92,692 Aufrufe • vor 7 Monaten •via X (Twitter)
37 Kommentare

I can't believe that browsers still can't handle `backdrop-filter: blur()` during opacity transitions. smh

Why can’t ai do this? It seems like a simple testing skill?

Where can we get the new translucent dropdown menus?

Shadcn way of showing components is so luxurious

It's broken sometimes

Translucent menu a11y is uniquely hard: `backdrop-filter: blur()` makes effective contrast dynamic — shifts with whatever’s behind the component, so WCAG 4.5:1 becomes a moving target. Do the new styles add an opaque fallback for `prefers-reduced-transparency`?

Hey @shadcn could u test how it looks when there is text underneath ? Love the amazing work ur are doing btw! ❤️

@AroshPererax I did. To be honest, I would've gone even lighter but had to keep it readable. Accessibility wins.

Yeah. especially on color-default.

@theo AI can't do

@matsugfx should have saved learnings tho and train a small model

Our job is safe.

Next level stuff!

¿Usaron algún framework de testing para automatizar parte del proceso? 🤔

What is the best model with visual understanding from your pov? I have been trying to apply agent-browser with claude to visual testing, no success.

You are working hard for everyone else. We are grateful 🫡

This is where humans still shine over agents. Design details require that extra subjective touch! 🐙

this is exactly why good design still needs humans

How about performance on low-end phones? As far as I remember, phone is struggling with backdrop-filter: blur

> Work that, for now, AI can't do. How come? I did tell it to follow WCAG guidelines + contrast ratios & sometimes use Puppeteer & it worked but for different problem.

The days of having to write your own versions of this are over

Well ai can do it now that you've provided it :(

uh, it sure can?

Can you not just set the menu to be open by default and do it once for each color/component?

Real talk. Thanks for sharing this, needed to hear it today 🙏

I think AI can automate the collection process. The visuals - is the human’s requirements, never be replaced completely.

AI generates layouts all day. But visual QA of 5 components × 5 styles × 2 modes over real backgrounds? Still deeply human work.

Nope humans have still a much higher taste for details

AI solves for correct but humans solve for feel. This level of detail is exactly why your library hits different 💯

Curious what you think is the bottleneck - is it the visual judgment (taste) or the systematic coverage across all permutations? Wondering if AI could at least help generate the test matrix while humans do the final visual call.

is it supposed to look like this?

Why can’t ai do this

Any ETA when this will ship? Looks great.

I know that pain all too well. Great work!

thanks for doing god's work 🙏🏻

Actually AI can. There is a color theory behind it. For example, in my project AI creates themes automatically, doing the math with oklch values and so, they are always readable, contrast is always in place and all themes are unique etc

@shadcn fair point! That level of testing does sound like rocket fuel for the next iteration of the open-source suite
