Design at theSpeed of Thought
GWAN is a high-performance reactive component library engineered for developers who demand surgical precision and scalable aesthetics.
Component
Intelligence
Predictive primitives that adapt to your layout context, providing consistent UX across every breakpoint.
Alex Chon
alex@gwan.dev
Optimised for
Production Flow
Engineered to work seamlessly with modern meta-frameworks, ensuring your bundle stays light and your interactions stay fluid.
1import { Button, Tag, Avatar } from '@gwan/core';2import { useTheme } from '@gwan/theming';34export default function Dashboard() {5const { theme, tokens } = useTheme();67return (8<Layout tokens={tokens}>9<Avatar10name="Alex Chon"11variant="initials"12/>13<Tag type="success" label="Active" />14<Button15variant="primary"16label="View Components"17/>18</Layout>19);20}Tree-shakeable Exports
Import only what you use. GWAN's modular architecture ensures your final bundle contains zero dead component code.
Strict Type Architecture
Every prop, variant, and token is fully typed with TypeScript. Catch design-system misuse at compile time, not in production.
Design Token Sync
CSS custom properties flow directly from your Figma tokens to production. One source of truth, zero drift between design and code.
Accessibility by Default
Every component ships with ARIA attributes, keyboard navigation, and focus management built in — WCAG 2.1 AA out of the box.
SSR & RSC Compatible
Built for the modern React ecosystem — components render seamlessly on the server, in streaming, and across React Server Component boundaries.
Built for Next.js.
Expanding Beyond.
GWAN is currently 100% Next.js. But the ecosystem is bigger — React, Remix, and Gatsby support is actively on the roadmap.
Next.js
Full support for App Router, Server Components, and SSR — the foundation GWAN was built on.
React
Pure React compatibility with Vite and CRA — for teams building SPAs without a meta-framework.
Remix
First-class Remix support with nested routing, server loaders, and edge-ready components.
Gatsby
Static-site ready with Gatsby's data layer and image optimisation pipeline in mind.
Want to accelerate a specific framework? Open an issue and let us know.
Nimesh Fonseka
“Our objective isn’t just to provide components, but to provide a cohesive language for the next generation of digital experiences. Precision is our baseline.”