Jambonz UI

A minimal, light-weight UI design system for developing frontends for jambonz apps. It's a kit-of-parts including fonts, a small set of CSS styles, a source set of SASS styles and JavaScript components. Whether you're developing a custom dev stack with tools like vite or webpack you should have no issues utilizing the resources available in the Jambonz UI library package.

Jambonz UI aims to provide foundational design materials like colors, fonts and typography as well as atomic design materials like buttons, icons etc. Currently the library is very lean but is expected to grow thoughtfully as jambonz frontend development continues to mature along this line of thinking. A primary goal of the library is to have a small footprint.

View on bundlephobia.

View the storybook.


Installing the package is easy. You can use any typical package manager for frontend stacks.

npm install @jambonz/ui-kit # or yarn add @jambonz/ui-kit
General usage

The UI kit can be used in any typical way we pull things into our modern frontend stacks. You can import the CSS, SASS and JS directly into your specific target entry points for bundling or you can load them statically the good-old-fashioned way. For the latter the package provides a singular public directory that consists of all static assets: CSS, JS and fonts. You can literally just copy these assets into your jambonz applications static directory if you want. This is also handy for serving extra static assets during development with tools like webpack-dev-server and also for copying just the raw static assets at build time when bundling.

  Next: Fonts and icons