# Nethesis Design System

> Rules shared by the user interfaces of Nethesis products: writing guidelines, glossary and
> visual foundations. The components are in @nethesis/vue-components
> (Storybook: https://nethesis.github.io/vue-components/), the designs in the NDS Figma file.
> NethServer 8 uses the Carbon Design System instead: only the writing guidelines and the
> glossary apply to it.

The pages of the site (https://nethesis.github.io/design-system/) are built in the browser. Read these files instead.

## Rules

- [Writing guidelines](writing-guidelines.md): how to write interface text, from voice and tone to buttons, forms, empty states, modals and notifications
- [Glossary](glossary.json): approved terms, Italian translations and terms to avoid

## Foundations

- [Colors](colors.json): semantic color tokens for the light and the dark theme, with their Tailwind CSS classes
- [Foundations](foundations.json): typography, iconography, spacing, border radius and width, focus ring, elevation and shadow

## Optional

- [Introduction](introduction.md): what the design system is made of, and how it applies to NethServer 8