Interactive Visualization of Style Props

skeletonlabs / skeleton

A complete design system and component solution, built on Tailwind.

https://skeleton.dev

MIT License

4.96k stars 315 forks source link

Interactive Visualization of Style Props #2587

Open endigo9740 opened 6 months ago

endigo9740 commented 6 months ago

Mantine does a wonderful job of this: https://mantine.dev/core/menu/#styles-api

We likely won't be able to get a version of this working for -every- component at launch. However, having this as a visual guide to explain the prefixed prop names for style properties might be a valuable learning tool!

When you hover over a section on the right, the respective portion of the component is highlighted with a red outline.

endigo9740 commented 3 weeks ago

See also the Anatomy sections from Zag: https://zagjs.com/components/react/accordion#anatomy