---
name: manavarya09-designlang-tokens
description: "Use when styling UI for webflow.com — references the extracted design system tokens instead of inventing colors, spacing, or typography."
license: "MIT"
metadata:
  decimalai-skill-id: "bd5662a4-bc2c-4b46-a8c6-c8fd2a2eb92e"
  decimalai-version-id: "165e9569-9b33-466c-8b16-047a956c5ceb"
  decimalai-version: "24"
  decimalai-body-sha256: "9d5acc0cd086f946ebf382c48f9a8b5c00afe0d82aa71d9f44e9ba4335ddf873"
  decimalai-name: "manavarya09/designlang-tokens"
  decimalai-format: "1"
  decimalai-invocation: "model"
  decimalai-category: "frontend"
  decimalai-source: "https://app.decimal.ai/s/manavarya09-designlang-tokens@24/SKILL.md"
---
# designlang tokens
Source: https://webflow.com
Extracted by designlang v7.0.0 on 2026-06-25T08:28:55.721Z

## Semantic tokens (use these)
- color.action.primary: #146ef5
- color.surface.default: #ffffff
- color.text.body: #000000
- radius.control: 2px
- typography.body.fontFamily: WF Visual Sans Variable

## Regions
- sidebar
- nav
- nav
- nav
- nav
- nav
- nav
- nav
- nav
- pricing
- sidebar
- nav
- content
- content
- testimonials
- content
- content
- content
- nav
- pricing
- footer
- nav

## How to use
- Prefer `semantic.*` tokens over `primitive.*`.
- Never invent new tokens or hex values; reuse the ones above.
- When a value is missing, pick the closest existing semantic token and flag the gap.
- Reference tokens by their dotted path (e.g. `semantic.color.action.primary`).