Getting started

VUD tokens are currently stored in a central repository on GitHub.

Namespacing	vud
Token levels	base, ref, comp
Variant	default, primary, secondary, tertiary, tint, transparent, inverse, muted, emphasis
Ordinary scale	hue strength: weak, moderate, strong, emphasis
Categories	situation: info, success, warning, error
Intended element	text, icon, fill, stroke, shadow
Intended part of UI	surface, border, scheme (chart)
Canvas	screen
T-shirt sizes	xs, s, md, lg, xl, xxl
Ordered scale	05, 10, 20, 30, 40, 50, 60, 70, 80, 90
Level	1,2,3,4,5,6,7,8,9,10,11,12,13,14
States	enabled, hover, pressed, focused, visited, selected, selected:hover, disabled, error
Names	font-families primary(ubuntu), secondary(open sans), tertiary(inter) font-weight-numeric 100, 200, 300, 400, 500, 600, 700, 800, 900 font-weight-keyword normal, bold contextual in regular heading-lg heading-md heading-sm body-sm-link body-sm body-xs contextual in medium heading-xl heading-md heading-sm body-sm contextual in bold body-sm body-xs tabular in regular, medium & bold td-xs td-sm td-md td-lg td-xl td-xxl td-xxl

VUD Product Design System

VUD Product Design System is a collection of design assets, tokens, guidelines, code snippets and components that guarantees consistency and efficiency in the design and development process across enterprise software solutions.

Getting started

VUD Product Design System

Resources

Support