Tiny bundle size
< 8 KB with tree shaking, Size Limit tested.
Device agnostic styles, components and hooks for Next.js. One design for any viewport (size, orientation, resolution), input method (touch, mouse) or network speed. Simple to build, test and use.
< 8 KB with tree shaking, Size Limit tested.
Intuitive layouts suitable for any screen size, without media queries.
Interactive components have clearly discernable :focus
styles.
Lightweight, pretty and accessible form field validation messages.
The color scheme adapts to the operating system’s light or dark mode.
Easily tweak the theme globally or in your components.
No intrusive normalization or resets; just the :root
essentials.
Special <Html>
component to style rendered markdown.
Lean use of semantically appropriate HTML elements.
Elegant use of React hooks, refs and fragments makes for a great DX.
Install from npm:
npm install device-agnostic-ui
{
"presets": [
[
"next/babel",
{
"styled-jsx": {
"optimizeForSpeed": false
}
}
]
]
}
Hopefully this won’t be necessary in the future, see vercel/styled-jsx#602.