FAQ
Common questions about Visuno — frameworks, theming, licensing, and how the components ship.
Short answers to the questions that come up most. If something isn't covered here, open an issue on GitHub.
General
Visuno is an open-source UI component library for building agent-powered products. Every component ships natively for Vanilla JS, React, Angular, and Flutter, built from one shared set of design tokens — so a component looks and behaves the same wherever you use it.
Yes. Visuno is open source under the MIT licence — free for personal and commercial projects, with no attribution required. See the components repository for the full licence text.
The Vanilla JS and React builds are the reference implementations and are stable. Angular and Flutter are native ports that mirror the same props and behaviour. As with any pre-1.0 library, pin a version and read the changelog before upgrading.
Frameworks
Four, from a single design source:
| Framework | Form |
|---|---|
| Vanilla JS | Plain HTML + CSS + JS — no build step, drop it in |
| React | .tsx components (requires React 19) |
| Angular | Standalone components (dm-* selectors, Angular 17+) |
| Flutter | Dart widgets, themed to match the web |
The Vanilla and React versions are the reference; Angular and Flutter mirror the same props and behaviour.
That's the goal — one design, four frameworks. Vanilla JS and React lead, and the Angular and Flutter ports follow. Each component's docs page shows the code for every framework it currently ships in, side by side.
Not for Vanilla JS — drop in the HTML, CSS, and JS and it works. React, Angular, and Flutter use their usual toolchains.
Yes. The React components are plain React 19 components with no framework lock-in, so they work in Next.js, Vite, Remix, or any React setup.
Theming & styling
Set data-theme="dark" on a parent element (web), or use Brightness.dark in the Flutter
theme. Every component reads the same tokens, so your whole UI flips at once.
The default Blueprint style is crisp and squared; Soft is rounded and plush. Switch
to Soft on the web with data-style="soft" on a parent element.
Yes. Design tokens drive everything — --dm-* custom properties on the web, and
DmColors / DmSpace / DmRadius in Flutter. Override a token once and the change flows
through every component.
Using the components
Pick a component from the sidebar, copy the snippet for your framework, and drop it in. Pull the shared core once (tokens + helpers), and every component you add after that just works.
Components are built with semantic markup, keyboard support, and reduced-motion handling where animation is involved. Accessibility notes specific to a component are called out on its docs page.
Open an issue on the issue tracker. Planned work and what's shipped are tracked on the roadmap and changelog.