device-agnostic-ui

    8.0.1 • Public • Published

    Device Agnostic UI logo

    Device Agnostic UI

    npm version CI status

    Device agnostic styles, components and hooks for React and Next.js apps — deviceagnosticui.com. One design for any viewport (size, orientation, resolution), input method (touch, mouse) or network speed. Simple to build, test and use.

    • 📦 Tiny bundle size. JS tested to be < 4.5 kB minified and gzipped, before tree shaking.
    • 📱 Mobile first. Intuitive layouts suitable for any screen size, without media queries.
    • ⌨️ Keyboard ok. Interactive components have clearly discernable :focus styles.
    • 🚨 Native UI. Lightweight, pretty and accessible form field validation messages.
    • 🌗 Dark mode. The color scheme adapts to the operating system’s light or dark mode.
    • 🎨 CSS variables. Easily tweak the theme globally or in your components.
    • 🌏 Few global styles. No intrusive normalization or resets; just the :root essentials.
    • 🖌 Style raw HTML. Special <Html> component to style rendered markdown.
    • 🧠 Semantic markup. Lean use of semantically appropriate HTML elements.
    • ⚛️ Modern React. Elegant use of React hooks, refs and fragments makes for a great DX.

    Setup

    To install with npm, run:

    npm install device-agnostic-ui

    Then load the styles.

    API

    Support

    • Node.js: ^12.20 || >= 14.13
    • Browsers: > 0.5%, not OperaMini all, not IE > 0, not dead

      This feature is exclusive to Teams

      Illustration of wombats

      The package file explorer is only available for Teams at the moment.

      We may support exploring this package in the future. Check back soon.

      Install

      npm i device-agnostic-ui

      DownloadsWeekly Downloads

      40

      Version

      8.0.1

      License

      MIT

      Unpacked Size

      73.6 kB

      Total Files

      61

      Last publish

      Collaborators

      • jaydenseric