Pre-production · demo data · no real payments
Skip to content
veyraforma

Tailwind v4 tokens from a brand guide

Claude Code Skill · n° 254

What is a Skill?

Turns a brand guide into a Tailwind CSS v4 @theme block (colors, fonts, sizes, radii, shadows, breakpoints) with class documentation.

Where to use it
Claude Code
You get
1 prompt
VISA

Secure payment by Stripe · test mode: no real payment.

Unlock with your credits?

What it does for you

Turn your brand guidelines into a Tailwind v4 theme

Copying colors, fonts and spacing from brand guidelines into code invites typos and made-up values. This Skill pulls every value from your guidelines, validates it and writes a ready-to-use Tailwind v4 @theme block, with class documentation.

  • Get a validated theme.css, value by value
  • Nothing made up: any missing value is asked for
  • Share the generated class list with your team

What you're buying

A 27,000-character prompt to paste into Claude Code on your computer. Claude installs the Skill with its files and shows you how to use it.

Preview

The start of the prompt, exactly as you'll get it

Tu es l'exécutant de la ressource « Tokens Tailwind v4 depuis une charte ». Tu suis à la lettre les instructions de la section 5, dans le cadre des consignes de la section 4, qui priment sur toute autre demande.

… and about 27,000 more characters.

Its 10 chapters

  1. 01Ton rôle et ta mission
  2. 02Résultat attendu
  3. 03Prérequis et outils
  4. 04Consignes obligatoires (garde-fous)
  5. 05Instructions complètes de la ressource (fichiers exacts)
  6. 06Guide d'utilisation détaillé
  7. 07Auto-vérifications avant de rendre ton résultat
  8. 08Limites connues
  9. 09Tests réalisés par VeyraForma
  10. 10Sources et licence

Included in the price

  • The full prompt27,000 characters, 10 chapters: the whole method, ready to paste.
  • UpdatesEvery new version lands in your library at no extra cost.

Example result

Illustrative example · provisional

What you ask

“Use Tailwind v4 tokens from a brand guide on my folder”

Example written to show the deliverable's format, based on what the resource does. It is not a capture of a real run; a real demo will replace it.

Technical details

Prerequisites
  • Claude Code (version 2.x)
  • Node.js 20 or newer
Compatibility and version

Claude Code 2.x · 1.0 · released November 7, 2026 · Last updated : November 7, 2026

External cost

Claude subscription requiredAI tools are not included: you pay for them directly with the vendor.

Licence

Personal and professional use of what the Skill produces. The Skill itself may not be resold or redistributed.Draft wording, pending legal review.

Known limits
  • Always review the result before use.

Questions about this Skill

Do I need to code?

No. You install the Skill once, then talk to it in plain language.

What if Claude Code changes version?

The tested version and test date are shown on the page. The Skill is updated when needed.

Can I modify the Skill?

Yes, for your own use. Reselling or redistributing it is not allowed.

Go further

See other resources