und CSS is a SCSS-based low level toolkit used as the basis for all things CSS at und Pohlen.
npm install @und-pohlen/und-css --save-dev
For further documentation see css.und-pohlen.de.
und CSS aims to make working with CSS easier by providing robust compositions and tools to flexibly set up visual languages fast.
und CSS consists of three parts: Tokens, Objects and Utilities
Tokens are namespaced CSS custom properties automatically generated from your settings. They provide fast and easy access to your visual language (colors, spacings, typography, etc.) from your components.
Objects are unstyled composition styles solving common layout problems such as grids, boxes or stacks. They are heavily inspired by Every Layout and provide basic responsive behaviour without relying on media queries – but rather by utilizing "modern" CSS such as flexbox or grid.
Utility classes are automatically generated from settings as well. They do one thing well – setting a single CSS property on an element. You can use utility classes for quickly setting font-sizes, colors or spacings on your elements. Und CSS provides an open utility configuration, so you can easily generate your own utility classes for whatever property you want.
und CSS does not reinvent the wheel but draws inspiration from frameworks and approaches we have worked with over the years. Most important influences are Inuit CSS’ namespace, Tailwind CSS’ flexible approach to utility classes and Every Layout’s robust and resilient CSS layout solutions.