Introduction
Nord UI is a free and open-source CSS UI Framework, based on Nord color palette.
Using CSS features like Flexbox and Custom properties, Nord UI make it easy to build user interfaces for modern browsers. it's lightweight and has minimum impact on your bundle size, see Bundle Phobia result.
Features
- Built-in Dark Theme 🌒
- RTL Support
- Lightweight and Modular
- Built for Modern Browsers
- Easy Customization
- Javascript free
Javascript
Nord UI written entirely in css (no preprocessor). so it's easy to integrate it with any js application.
Whether you're building a SPA, an universal app or a static site, you just have to import Nord UI bundle and start making your app.
Altough components created using CSS, some of them need javascript functionality to work (like modal
). we provide only required classes to work and you need to handle class manipulation to use them in your app. some components (like collapse
) also give you chances to whether use javascript with them or use only plain html.
Browser Compatibility
Nord UI is built for modern web apps and tries to keep code base small and easily customizable. to achieve this goal, it makes heavy use of Modern CSS features like Flexbox and Custom properties. therefore, old browsers (like IE 11) are not supported at all and most components fail to display properly on them.
So if you're going to add Nord UI to your project, you may consider Caniuse browser support statistics for minimum support:
Global support | Chrome Desktop | Firefox Desktop | Opera Desktop | Safari | Edge | IE | Chrome Android | Safari IOS | |
---|---|---|---|---|---|---|---|---|---|
Custom Properties | 94% | 49 | 31 | 36 | 9.1 | 16 | - | 80 | 9.3 |
Flexbox | 96% | 29 | 28 | 17 | 9 | 12 | - | 80 | 9 |