Tokener

About this plugin

A powerful Figma plugin for extracting and managing design tokens. Tokener automatically generates comprehensive visual documentation from your local styles and variables, organized into clean, professional sections directly on canvas.

Built while creating the design system at Hyperzod , solving real friction in documenting tokens at scale.

Features:

- Extract variables (colors, numbers, strings, booleans) with light/dark mode support

- Visualize text styles with font details and hierarchical organization

- Display shadow effects as preview cards

- Generate color style cards with WCAG contrast ratios and hex values

- Create new styles from selected layers

- Detach styles and variables from selections

- Filter collections and modes for customized extraction