Back to skills
SKILL.md
Orthotect Tokens
ASecurityGenerate, extend, and compile DTCG W3C 3-tier design tokens (primitives -> semantics -> component tokens) across Light and Dark modes.
- 2 stars
- 0 votes
- 0 copies
- 3 views
- Added October 24, 2026
Security analysis
100/100npx -y skills add seotarek/orthotect --skill orthotect-tokens --agent claude-codeAre you the author of Orthotect Tokens?
Add the live security badge to your README. It updates with every re-scan.
[](https://www.skillsdirectory.com/skills/seotarek-orthotect-tokens)---
name: orthotect-tokens
description: Generate, extend, and compile DTCG W3C 3-tier design tokens (primitives -> semantics -> component tokens) across Light and Dark modes.
---
# Skill: Orthotect Design Tokens
Manage design tokens in accordance with the official W3C Design Tokens Community Group (DTCG) specification.
## 3-Tier Architecture
1. **Primitives (`core/tokens/primitives.json`):** Raw palette values (`neutral.900`, `brand.600`), dimensions, radii.
2. **Semantics (`core/tokens/semantics.json`):** Role-based mappings (`surface.canvas`, `content.primary`, `action.danger`) resolved for `light` and `dark` themes.
3. **Components:** Scoped tokens referencing semantic variables directly in CSS (`var(--ot-surface-panel)`).
## Compilation
Transform tokens into platform CSS custom properties:
```bash
node bin/orthotect.js compile core/tokens --out examples/golden-showcase/tokens.css
```
## Verification
Run:
```bash
python3 gates/gate_contrast_wcag.py
```
Attribution
Related skills
View all in ai-agents →Comments
Loading comments…
Newsletter
Get the weekly list of safe new skills, and the ones we pulled.