Agent skill

I Normalize

by boussadjra in boussadjra/vuestrata

Normalize design to match your design system and ensure consistency

MITAuto-check passedFrontend & Design

Install I Normalize

skills CLI
$ npx skills add boussadjra/vuestrata --skill i-normalize -a claude-code

Project install by default; add -g for ~/.claude/skills/.

GitHub CLI
$ gh skill install boussadjra/vuestrata i-normalize --agent claude-code

Project scope by default; add --scope user for a personal install. Needs GitHub CLI 2.90.0 or later (public preview).

Manual copy
$ git clone --depth 1 https://github.com/boussadjra/vuestrata.git skills-src && mkdir -p .claude/skills && cp -r skills-src/.github/skills/i-normalize .claude/skills/i-normalize && rm -rf skills-src

Use ~/.claude/skills/ instead of .claude/skills for a personal install. The folder must contain SKILL.md.

Claude Code skills documentation · loads skills from .claude/skills/

Facts

Skill name
i-normalize
GitHub stars
111
Used in
7 other repos
Token cost
~944 tokens
SKILL.md length
461 words
Files
1
Skills in repo
21
Repo updated
First seen
Licence
MIT

At a glance

Normalize design to match your design system and ensure consistency

  • Works in 3 steps: Discover the design system: Search for… → Analyze the current feature: Assess what… → Create a normalization plan: Define…
  • Tasks that involve Design systems
  • SKILL.md covers Plan, Execute and Clean Up
  • Instructions only: no scripts, shell commands, URLs or credentials in SKILL.md

What it does

I Normalize is an agent skill from boussadjra/vuestrata. Normalize design to match your design system and ensure consistency

Its SKILL.md is about 940 tokens, which your agent loads only when the skill is triggered. It is a single SKILL.md file with no bundled scripts.

It sits in Frontend & Design, covering Design systems. The repository describes itself as: A modern, production-ready Vue 3 template with multi-theme support, Reka UI wrappers, and enterprise-grade tooling. The licence is MIT.

When your agent uses it

  • Tasks that involve Design systems

Example prompts

  • “/i-normalize”

Workflow steps

3 steps, taken from the first numbered list in SKILL.md.

  1. Discover the design system: Search for design system documentation, UI guidelines, component libraries, or style guides (grep for "design…
  2. Analyze the current feature: Assess what works and what doesn't
  3. Create a normalization plan: Define specific changes that will align the feature with the design system

What it can do on your machine

Read from SKILL.md and the folder at commit 73cbf9f. It shows what the files ask for, not the result of running them.

  • Tool permissions

    Pre-approves nothing: there is no allowed-tools line, so your agent's usual permission prompts apply.

    From allowed-tools in the SKILL.md frontmatter.

  • Runs code

    No scripts in the folder and no shell commands in SKILL.md.

    From the folder's file list and the shell code blocks in SKILL.md.

  • Network

    No URLs in SKILL.md.

    From URLs in SKILL.md, links to its own repository left out.

  • Credentials

    Names no API keys, tokens, secrets or passwords.

    From names ending in _API_KEY, _TOKEN, _SECRET, _KEY or _PASSWORD in SKILL.md.

Context cost

I Normalize loads about 944 tokens when it runs. Until then it costs about 20 tokens; SKILL.md has 461 words of instructions outside code blocks.

Always · name and description, kept in context so the agent knows when to use it
~20
When it runs · the whole SKILL.md, loaded when a task matches
~944

Estimates: characters ÷ 4, the usual rule of thumb; real counts depend on the model's tokenizer. Scripts and assets cost tokens only if the agent reads them.

Safety

Auto-check passed

The automated check found no risky patterns in SKILL.md.

Automated static check — not a guarantee. Review scripts before installing. It scans the text of SKILL.md for risky patterns (piping downloads into a shell, reading credential files, hidden Unicode, destructive commands); files beside SKILL.md are not scanned.

SKILL.md

The full file from boussadjra/vuestrata at commit 73cbf9f, republished under its MIT licence (© boussadjra). 461 words, ~944 tokens.

Download SKILL.mdSave it as .claude/skills/i-normalize/SKILL.md (or your agent's skills folder).
name
i-normalize
description
Normalize design to match your design system and ensure consistency
user-invocable
true
argument-hint
(optional) Specific feature to focus on

Analyze and redesign the feature to perfectly match our design system standards, aesthetics, and established patterns.

Plan

Before making changes, deeply understand the context:

  1. Discover the design system: Search for design system documentation, UI guidelines, component libraries, or style guides (grep for "design system", "ui guide", "style guide", etc.). Study it thoroughly until you understand:

    • Core design principles and aesthetic direction
    • Target audience and personas
    • Component patterns and conventions
    • Design tokens (colors, typography, spacing)

    CRITICAL: If something isn't clear, ask. Don't guess at design system principles.

  2. Analyze the current feature: Assess what works and what doesn't:

    • Where does it deviate from design system patterns?
    • Which inconsistencies are cosmetic vs. functional?
    • What's the root cause—missing tokens, one-off implementations, or conceptual misalignment?
  3. Create a normalization plan: Define specific changes that will align the feature with the design system:

    • Which components can be replaced with design system equivalents?
    • Which styles need to use design tokens instead of hard-coded values?
    • How can UX patterns match established user flows?

    IMPORTANT: Great design is effective design. Prioritize UX consistency and usability over visual polish alone. Think through the best possible experience for your use case and personas first.

Execute

Systematically address all inconsistencies across these dimensions:

  • Typography: Use design system fonts, sizes, weights, and line heights. Replace hard-coded values with typographic tokens or classes.
  • Color & Theme: Apply design system color tokens. Remove one-off color choices that break the palette.
  • Spacing & Layout: Use spacing tokens (margins, padding, gaps). Align with grid systems and layout patterns used elsewhere.
  • Components: Replace custom implementations with design system components. Ensure props and variants match established patterns.
  • Motion & Interaction: Match animation timing, easing, and interaction patterns to other features.
  • Responsive Behavior: Ensure breakpoints and responsive patterns align with design system standards.
  • Accessibility: Verify contrast ratios, focus states, ARIA labels match design system requirements.
  • Progressive Disclosure: Match information hierarchy and complexity management to established patterns.
Show full SKILL.md (146 more words)Show less

NEVER:

  • Create new one-off components when design system equivalents exist
  • Hard-code values that should use design tokens
  • Introduce new patterns that diverge from the design system
  • Compromise accessibility for visual consistency

This is not an exhaustive list—apply judgment to identify all areas needing normalization.

Clean Up

After normalization, ensure code quality:

  • Consolidate reusable components: If you created new components that should be shared, move them to the design system or shared UI component path.
  • Remove orphaned code: Delete unused implementations, styles, or files made obsolete by normalization.
  • Verify quality: Lint, type-check, and test according to repository guidelines. Ensure normalization didn't introduce regressions.
  • Ensure DRYness: Look for duplication introduced during refactoring and consolidate.

Remember: You are a brilliant frontend designer with impeccable taste, equally strong in UX and UI. Your attention to detail and eye for end-to-end user experience is world class. Execute with precision and thoroughness.

© boussadjra, MIT. Rendered from Markdown: HTML in the file is shown as text, images as links, and headings moved down two levels. Raw file

Files

Just SKILL.md in .github/skills/i-normalize of boussadjra/vuestrata.

Open the folder on GitHubat commit 73cbf9f

Used in 7 other repositories

We found 7 copies of this SKILL.md (exact, near-identical or edited) in other folders, from 7 other GitHub owners. This page covers the copy in boussadjra/vuestrata, which our catalogue first saw on October 7, 2026.

Compare with similar skills

I Normalize next to the 5 skills that share the most tags, products or categories with it. Stars are the repository's; “used in” counts other GitHub owners with a copy.

I Normalize compared with similar skills
SkillStarsUsed inTokensAuto-checkLicenceRepo updated
I Normalize this skillboussadjra/vuestrata1117 repos~944Automated safety check: PassMIT
Impeccablebestofjs/bestofjs3.1k27 repos~2.6kAutomated safety check: PassMIT
Figma Design System Builderwarpdotdev/warp65k2 repos~4.4kAutomated safety check: PassAGPL-3.0
Figma use_figma Plugin API Ruleswarpdotdev/warp65k4 repos~4.4kAutomated safety check: PassAGPL-3.0
UI StylingOhh-889/skyroc79513 repos~2.5kAutomated safety check: PassMIT
Shadcnsupabase/evals14342 repos~4.5kAutomated safety check: PassApache-2.0

Similar skills

  • Impeccable

    bestofjs/bestofjs

    A skill your agent uses when the user wants to design, redesign, shape, critique, audit, polish, clarify, distill, harden, optimize, adapt, animate, colorize, extract, or otherwise improve a…

    3.1k GitHub starsUsed in 27 repos~2.6k tokens
    Frontend & DesignAuto-check passed
  • Builds or updates a design system in Figma from a codebase in ordered phases: discovery, variables and tokens, components, theming and documentation, with checkpoints.

    65k GitHub starsUsed in 2 repos~4.4k tokens
    Frontend & DesignAuto-check passed
  • Required groundwork before any use_figma call: the rules and reference files for running JavaScript in a Figma file through the Plugin API without common failures.

    65k GitHub starsUsed in 4 repos~4.4k tokens
    Frontend & DesignAuto-check passed
  • UI Styling

    Ohh-889/skyroc

    Create beautiful, accessible user interfaces with shadcn/ui components (built on Radix UI + Tailwind), Tailwind CSS utility-first styling, and canvas-based visual designs.

    795 GitHub starsUsed in 13 repos~2.5k tokens
    Frontend & DesignAuto-check passed
  • Shadcn

    supabase/evals

    Official

    Manages shadcn components and projects — adding, searching, fixing, debugging, styling, and composing UI.

    143 GitHub starsUsed in 42 repos~4.5k tokens
    Frontend & DesignAuto-check passed
  • Design System

    Ohh-889/skyroc

    Token architecture, component specifications, and slide generation.

    795 GitHub starsUsed in 11 repos~1.7k tokens
    Frontend & DesignAuto-check passed

More from boussadjra/vuestrata

All 21 skills in this repo
  • I Delight

    boussadjra/vuestrata

    Add moments of joy, personality, and unexpected touches that make interfaces memorable and enjoyable to use.

    111 GitHub starsUsed in 11 repos~2.6k tokens
    Auto-check passed
  • I Optimize

    boussadjra/vuestrata

    Improve interface performance across loading speed, rendering, animations, images, and bundle size.

    111 GitHub starsUsed in 11 repos~1.9k tokens
    Auto-check passed
  • I Frontend Design

    boussadjra/vuestrata

    Create distinctive, production-grade frontend interfaces with high design quality.

    111 GitHub starsUsed in 9 repos~2k tokens
    Auto-check passed
  • I Harden

    boussadjra/vuestrata

    Improve interface resilience through better error handling, i18n support, text overflow handling, and edge case management.

    111 GitHub starsUsed in 7 repos~2.3k tokens
    Auto-check passed
  • I Onboard

    boussadjra/vuestrata

    Design or improve onboarding flows, empty states, and first-time user experiences.

    111 GitHub starsUsed in 7 repos~2k tokens
    Auto-check passed
  • I Teach Impeccable

    boussadjra/vuestrata

    One-time setup that gathers design context for your project and saves it to your AI config file.

    111 GitHub starsUsed in 6 repos~672 tokens
    Auto-check passed

Questions about I Normalize

What does I Normalize do?

Normalize design to match your design system and ensure consistency. I Normalize is an agent skill from boussadjra/vuestrata.

When should I use I Normalize?

I Normalize fits situations like: tasks that involve Design systems.

How do I install I Normalize in Claude Code?

Run `npx skills add boussadjra/vuestrata --skill i-normalize -a claude-code`. Or copy the skill folder (.github/skills/i-normalize in boussadjra/vuestrata) into .claude/skills/i-normalize in your project. Claude Code loads it when a task matches its description.

How do I install I Normalize in Codex?

Run `npx skills add boussadjra/vuestrata --skill i-normalize -a codex`. Or copy the skill folder (.github/skills/i-normalize in boussadjra/vuestrata) into .agents/skills/i-normalize in your project. Codex loads it when a task matches its description.

Can I use I Normalize in Cursor, Gemini CLI or GitHub Copilot?

Cursor, Gemini CLI, GitHub Copilot and OpenCode also load SKILL.md folders. With the skills CLI, run `npx skills add boussadjra/vuestrata --skill i-normalize -a cursor` (or -a gemini-cli, github-copilot or opencode for the others). To copy it by hand, put the folder in .cursor/skills/i-normalize, .gemini/skills/i-normalize, .github/skills/i-normalize and .opencode/skills/i-normalize in your project.

What does I Normalize need to run?

SKILL.md names no scripts, command-line tools or credentials: I Normalize is instructions for the agent only.

Does I Normalize access the network?

SKILL.md contains no URLs. Any network use would come from the scripts or tools the agent runs. This is read from the text; nothing was executed.

Is I Normalize safe to install?

Our automated static check of SKILL.md found no risky patterns, such as piping downloads into a shell, reading credential files or hidden Unicode. It is not a guarantee. Review the folder before installing.

What licence does I Normalize use?

I Normalize is published under the MIT licence (the repository's licence). It allows redistribution, so the full SKILL.md is shown on this page.

How many tokens does I Normalize use?

About 944 tokens (SKILL.md is roughly 3.8k characters). Agents keep only the skill's name and description in context until a task matches; then they load SKILL.md in full.

What are the alternatives to I Normalize?

Skills that share tags, products or a category with I Normalize: Impeccable (bestofjs/bestofjs, 3.1k stars), Figma Design System Builder (warpdotdev/warp, 65k stars), Figma use_figma Plugin API Rules (warpdotdev/warp, 65k stars) and UI Styling (Ohh-889/skyroc, 795 stars). The comparison table on this page puts their stars, adoption, token cost, safety result and licence side by side.

Who maintains I Normalize?

boussadjra (a GitHub user) maintains it in boussadjra/vuestrata, which has 111 GitHub stars. The repository holds 21 skills in this directory. The repository was last updated on October 5, 2026.

Source: boussadjra/vuestrata on GitHub. Facts on this page come from the repository at the commit we read; the author's words are quoted as theirs.