Skip to main content
PROYECTOVIVIANA
Two styled systems · One Solid foundation

Two styled component systems, one Solid foundation.

Accessible SolidJS components, faithfully ported from Adobe’s React Aria. Pick the look — the Glasselated viviana-ui or pixel-faithful solid-spectrum — both share the same certified-accessible core.

viviana-uiGlasselated

Our expressive register — frosted glass, pixel accents, the Geist trio. The house design system, live in the showcase.

npm i @proyecto-viviana/uiExplore the showcase →
solid-spectrumSpectrum 2 parity

Adobe Spectrum 2 for Solid — pixel-faithful to React Spectrum and certified cell-by-cell against the upstream pin.

npm i @proyecto-viviana/solid-spectrumRead the docs →
Both built onsolidaria · solid-stately · solidaria-components

Token-driven

Components read every color from --color-* custom properties. Override the vars and the whole library adopts your palette — no forks, no per-component overrides.

Accessible

Keyboard navigation, focus management, and screen-reader semantics are built in and contrast-certified — the same behavior React Spectrum ships, ported faithfully to SolidJS.

Copy-paste

The Theme Studio generates the exact :root and light-scheme blocks. Paste them after the library’s stylesheet and you’re done.

Real components, live
37

Ready to make it yours?

Open the Theme Studio →