Use when styling UI for railway.app — references the extracted design system tokens instead of inventing colors, spacing, or typography.
Scanned 9/5/2026
Install to Claude Code
Skills Directorynpx -y skills add Manavarya09/design-extract --skill designlang --agent claude-codeInstalls into .claude/skills of the current project.
Are you the author of Designlang?
Add the live security badge to your README — it updates automatically with every re-scan.
[](https://www.skillsdirectory.com/skills/manavarya09-designlang-44491f2c)More formats (shields.io, HTML) on the badges page.
---
name: designlang-tokens
description: Use when styling UI for railway.app — references the extracted design system tokens instead of inventing colors, spacing, or typography.
---
# designlang tokens
Source: https://railway.app
Extracted by designlang v7.0.0 on 2026-06-25T08:29:38.182Z
## Semantic tokens (use these)
- color.action.primary: #59497a
- color.surface.default: #13111c
- color.text.body: #ffffff
- radius.control: 4px
- typography.body.fontFamily: Inter
## Regions
- nav
- hero
- testimonials
- content
- content
- testimonials
- testimonials
- pricing
- pricing
- nav
- footer
## 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`).
Is this your skill, or is something wrong with this listing? Request removal or report an issue. Author removals are honored within 72 hours.
No comments yet. Be the first to comment!
Implement modern responsive layouts using container queries, fluid typography, CSS Grid, and mobile-first breakpoint strategies. Use when building adaptive interfaces, implementing fluid layouts, or creating component-level responsive behavior.
