Installation

Get started using our design system by installing it into your project. We support Vue, Nuxt and Figma.

Copy link to headline:Basic setup

Select your platform or framework to get started:

Additional content is available for Schwarz Group employees.

Step 1: Create a Vue application
Follow the official Vue installation guide(opens in a new tab) to create a new Vue application if needed.
Step 2: Install Onyx
Install the sit-onyx package:
Step 3: Add styles and plugin
Import the styles and register the Vue plugin in your main.ts file. Pass your router(opens in a new tab) and i18n(opens in a new tab) instances to enable integrations.
global.css is optional but strongly recommended when the entire application is built with Onyx. Components are scoped to prevent side effects on global elements like <body>, making it safe to integrate with existing styles or other design systems.