A modular, configuration-first front-end framework. No strings.

Download Learn More

Version: 8.1.0

CircleCI  devDependencies Status  npm version  Netlify Status

  • Tiny

    CSS and JS is 17kb minified + gzipped; you can be assured performance isn’t an issue.

  • Modular

    Remove and namespace pieces of the framework to prevent collisions and take only what you need.

  • Configurable

    Built for a great developer experience, you can customize and extend the library with ease.

  • Accessible

    Interactive components are designed with WAI-ARIA guidelines in mind to ensure your HTML is accessible.

Painless Setup

Install with npm:

$ npm install undernet


// my-styles.scss
@import "~undernet/src/scss/undernet";


// my-script.js
import Undernet from "undernet"

if (document) 
  document.addEventListener("DOMContentLoaded", function() {
    Undernet.start() 
  })

Or link to minified assets:

<html>
  <head>
    <link
      rel="stylesheet"
      href="https://cdn.jsdelivr.net/npm/undernet@8.1.0/dist/undernet.min.css"
      integrity="sha256-t10LWO9nOSH/ZebcqTaWStw4Klck34xxlccrhVaomxg="
      crossorigin="anonymous"
    />

    <!-- add other styles/css here -->
  </head>
  <body>
    <!-- add page content here -->

    <script
      type="text/javascript"
      src="https://cdn.jsdelivr.net/npm/undernet@8.1.0/dist/undernet.bundle.min.js"
      integrity="sha256-am6vAHMcM/VM5t7fA2/WTBPL4UbehfbYc4M7aLFe824="
      crossorigin="anonymous"
    ></script>
    <script type="text/javascript">
      // Undernet is now  attached to the `window`
      if (document)
        document.addEventListener("DOMContentLoaded", function() {
          Undernet.start()
        })
    </script>
  </body>
</html>

See how Undernet can improve your developer experience!

Learn More