Research

ux-skill

A design intelligence engine for AI coding tools. One brand colour in, a WCAG-checked design system out. Offline, no LLM, MIT.

In one paragraph

ux-skill is an open-source design intelligence engine that plugs into Claude Code and 16 other AI coding tools so the interfaces they build stop reading as AI-made. Version 4.0, Foundations, builds a full design system from one brand colour and a brief, checks every colour pairing against WCAG, and writes only what passes, with Arabic and right to left built in. It runs offline, never calls an LLM, and is free under MIT. Built and maintained by Laith Aljunaidy in Amman.

v4.0.0 Foundations, live, MIT

Why I built it

AI coding tools can build a whole product in an afternoon, and every one of them comes out looking the same. The same purple gradient, the same three cards, the same stock hero, the same type. You can spot an AI-built page from across the room.

I design for a living, and I build with these tools every day. I wanted them to design the way a designer would: start from the brand and the brief, refuse the patterns that read as machine-made, and check the work before it ships. And I wanted Arabic and right to left to be part of the system from the first token, not a fix at the end, because that is where most tools fail the people I design for.

So ux-skill does not paste a template. It compiles a design language for the brief in front of it, from real brand specs treated as training data, and a linter that rejects the slop.

A landing page built with ux-skill: a real construction photo under a dark scrim, an editorial headline and a quote form in the hero

Same AI coding tool, same prompt. With ux-skill supplying the constraints, the page stops looking generic.

What is new in 4.0

Version 4.0, Foundations, shipped on 2 November 2026. One brand colour and a brief in, a complete design system out.

The ux-skill site: one brand color in, a design system out

  • Nine foundations. Colour, type, space, layout, radius, border, elevation, motion and imagery, each from primitives to semantic roles, written as W3C design tokens and CSS.
  • Five modes in every role. Light and dark, standard and high contrast, comfortable and compact, left to right and right to left, full and reduced motion. One attribute on the page switches each one.
  • The WCAG gate. Every text, control and focus pairing is measured in light and dark, at standard and high contrast. A system that fails is not written, and the message says what to change.
  • Arabic built in. Under right to left the text switches to an Arabic face with its own scale and line height, spacing turns logical and motion mirrors.
  • It reads the system you already have. Importers for design tokens, CSS, Tailwind, Markdown rules and Figma variables. It reports what is missing and adds it beside your files without rewriting a token.
  • Components and sections with contracts. 23 component contracts and 14 section contracts say which tokens each part binds in every state, and how each section works on a phone.
  • A linter that runs the page. It opens the page in a real browser at desktop and phone width and checks what a person would notice: focus rings that do not show, hover that answers late, motion that ignores reduced motion.

How it works

A Python reasoning core with a deterministic seven-axis synthesizer: warmth, contrast, density, geometry, formality, motion and type personality. Twelve structured manifests feed it, among them styles, palettes, type pairings, components, industries, charts, motion presets, UX laws, anti-pattern rules, tech stacks and 160 real brand specs. Same inputs, same output, every time.

It ships into Claude Code, Cursor, Windsurf, GitHub Copilot, Gemini CLI, Codex and eleven more tools, as slash commands, sub-agents and an MCP server. It runs fully offline, never calls an LLM, and collects nothing.

ux-skill on GitHub

In numbers

Version4.0.0, Foundations, 2 November 2026
AI coding tools supported17
Design foundations9
Anti-pattern lint rules171
Real brand specs160
MCP tools25
Slash commands18
Component and section contracts23 and 14
README languages17
GitHub stars, 9 November 202695
LicenceMIT, free

Status

Live and maintained. Install it with pip install uxskill, read the code on GitHub, and see it at uxskill.laithjunaidy.com. This website was built with it.

FAQ

What is ux-skill?

ux-skill is a free, open-source design intelligence engine for AI coding tools such as Claude Code, Cursor and Windsurf. It builds design systems from a brand colour and a brief, and lints AI-built pages for the patterns that make them look generic.

What is new in ux-skill 4.0?

Version 4.0, Foundations, builds a complete design system from one brand colour: nine foundations, five modes in every role, a WCAG contrast gate, Arabic and right to left built in, importers for existing systems, and component and section contracts.

Does ux-skill call an AI model?

No. It runs fully offline with a deterministic engine and structured data, never calls an LLM and collects no telemetry. The same inputs always give the same output.

Open the project

Also in research

All research
  1. Dot

    Dot is a loyalty and rewards platform for merchants in the Middle East, live at thedotwallet.com. A customer is identified by phone only, never email, and their points and rewards follow them across every merchant on the network. Points run on an event ledger with signed single-use redemption tokens and fraud checks on every path. Arabic-first, with a cashier app, an Odoo POS plugin, and a Shopify integration. Founded and operated by Laith Aljunaidy.

    Live Open