Agent skill

Atlas

Atlas — a design language and UI guide system for agent interfaces.

Install Atlas

skills CLI

$ npx skills add pacifio/ui --skill atlas -a claude-code

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

GitHub CLI

$ gh skill install pacifio/ui atlas --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/pacifio/ui.git skills-src && mkdir -p .claude/skills && cp -r skills-src/skills/atlas .claude/skills/atlas && 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/

Paste into Claude Code

Install the "atlas" agent skill from https://github.com/pacifio/ui/tree/main/skills/atlas into .claude/skills/atlas/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "atlas", then confirm the skill loads.

Claude Code copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.

$skill-installer

$skill-installer install https://github.com/pacifio/ui/tree/main/skills/atlas

Type this inside Codex. $skill-installer <name> installs a curated skill from openai/skills. The installer writes to $CODEX_HOME/skills (default ~/.codex/skills). Restart Codex if the skill does not show up.

skills CLI

$ npx skills add pacifio/ui --skill atlas -a codex

Project install goes to .agents/skills/; add -g for ~/.codex/skills/.

GitHub CLI

$ gh skill install pacifio/ui atlas --agent codex

Project scope by default (.agents/skills/); add --scope user for a personal install.

Manual copy

$ git clone --depth 1 https://github.com/pacifio/ui.git skills-src && mkdir -p .agents/skills && cp -r skills-src/skills/atlas .agents/skills/atlas && rm -rf skills-src

Use ~/.agents/skills/ instead of .agents/skills for a personal install.

Codex skills documentation · loads skills from .agents/skills/

Paste into Codex

Install the "atlas" agent skill from https://github.com/pacifio/ui/tree/main/skills/atlas into .agents/skills/atlas/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "atlas", then confirm the skill loads.

Codex copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.

skills CLI

$ npx skills add pacifio/ui --skill atlas -a cursor

Project install goes to .agents/skills/; add -g for ~/.cursor/skills/.

GitHub CLI

$ gh skill install pacifio/ui atlas --agent cursor

Project scope by default (.agents/skills/); add --scope user for a personal install.

Manual copy

$ git clone --depth 1 https://github.com/pacifio/ui.git skills-src && mkdir -p .cursor/skills && cp -r skills-src/skills/atlas .cursor/skills/atlas && rm -rf skills-src

Use ~/.cursor/skills/ instead of .cursor/skills for a personal install.

Cursor skills documentation · loads skills from .cursor/skills/, .agents/skills/, .claude/skills/, .codex/skills/

Paste into Cursor

Install the "atlas" agent skill from https://github.com/pacifio/ui/tree/main/skills/atlas into .cursor/skills/atlas/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "atlas", then confirm the skill loads.

Cursor copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.

gemini skills install

$ gemini skills install https://github.com/pacifio/ui.git --path skills/atlas

--scope user (default) or --scope workspace; --path is the subfolder of the repo that holds the skill; --consent skips the security confirmation prompt.

skills CLI

$ npx skills add pacifio/ui --skill atlas -a gemini-cli

Project install goes to .agents/skills/; add -g for ~/.gemini/skills/.

GitHub CLI

$ gh skill install pacifio/ui atlas --agent gemini-cli

Project scope by default (.agents/skills/); add --scope user for a personal install.

Manual copy

$ git clone --depth 1 https://github.com/pacifio/ui.git skills-src && mkdir -p .gemini/skills && cp -r skills-src/skills/atlas .gemini/skills/atlas && rm -rf skills-src

Use ~/.gemini/skills/ instead of .gemini/skills for a personal install, then run /skills reload.

Gemini CLI skills documentation · loads skills from .gemini/skills/, .agents/skills/

Paste into Gemini CLI

Install the "atlas" agent skill from https://github.com/pacifio/ui/tree/main/skills/atlas into .gemini/skills/atlas/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "atlas", then confirm the skill loads.

Gemini CLI copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.

GitHub CLI

$ gh skill install pacifio/ui atlas

Installs for Copilot at project scope by default; add --scope user for a personal install. Preview a skill first with gh skill preview. Needs GitHub CLI 2.90.0 or later (public preview).

skills CLI

$ npx skills add pacifio/ui --skill atlas -a github-copilot

Project install goes to .agents/skills/; add -g for ~/.copilot/skills/.

Manual copy

$ git clone --depth 1 https://github.com/pacifio/ui.git skills-src && mkdir -p .github/skills && cp -r skills-src/skills/atlas .github/skills/atlas && rm -rf skills-src

Use ~/.copilot/skills/ instead of .github/skills for a personal install. Commit .github/skills so cloud agent and code review can use it.

GitHub Copilot skills documentation · loads skills from .github/skills/, .claude/skills/, .agents/skills/

Paste into GitHub Copilot

Install the "atlas" agent skill from https://github.com/pacifio/ui/tree/main/skills/atlas into .github/skills/atlas/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "atlas", then confirm the skill loads.

GitHub Copilot copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.

skills CLI

$ npx skills add pacifio/ui --skill atlas -a opencode

OpenCode documents no install command of its own. Project install goes to .agents/skills/; add -g for ~/.config/opencode/skills/.

GitHub CLI

$ gh skill install pacifio/ui atlas --agent opencode

Project scope by default (.agents/skills/); add --scope user for a personal install.

Manual copy

$ git clone --depth 1 https://github.com/pacifio/ui.git skills-src && mkdir -p .opencode/skills && cp -r skills-src/skills/atlas .opencode/skills/atlas && rm -rf skills-src

Use ~/.config/opencode/skills/ instead of .opencode/skills for a personal install.

OpenCode skills documentation · loads skills from .opencode/skills/, .claude/skills/, .agents/skills/

Paste into OpenCode

Install the "atlas" agent skill from https://github.com/pacifio/ui/tree/main/skills/atlas into .opencode/skills/atlas/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "atlas", then confirm the skill loads.

OpenCode copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.

Facts

Skill name: atlas
GitHub stars: 154
Token cost: ~2.5k tokens
SKILL.md length: 1,003 words
Files: 60 (incl. references)
Skills in repo: 1
Repo updated: Apr 24, 2026
First seen: Oct 7, 2026
Licence: MIT

At a glance

Atlas — a design language and UI guide system for agent interfaces.

Works in 8 steps: references/tokens.md — every CSS… → references/components.md — every… → references/patterns.md — 3-pane shell,… → …
Tasks that involve Design systems
SKILL.md covers On activation: read these…, The three assets, three jobs, Ask the stack question before… and Non-negotiable visual rules, plus 3 more sections
Instructions only: no scripts, shell commands, URLs or credentials in SKILL.md

What it does

Atlas is an agent skill from pacifio/ui. Atlas — a design language and UI guide system for agent interfaces. Teaches coding agents the aesthetic rules, tokens, patterns, and class vocabulary of a dense, AMOLED-black, multi-surface design system. Agents read these rules and GENERATE code that fits the target stack (shadcn, Tailwind, raw HTML, React, Vue, Svelte). The included colorsandtype.css is a reference implementation, not a required dependency. Use heavily when building any UI — dashboards, chat interfaces, admin panels, landing pages, mobile…

Its SKILL.md is about 2.5k tokens, which your agent loads only when the skill is triggered. The skill folder holds 60 other files, including reference files.

It sits in Frontend & Design, covering Design systems, Landing pages and CSS and styling. It works with shadcn/ui, React, Svelte and Vue.js. The repository describes itself as: The shadcn for agent UI. A framework-agnostic design language for dense, AMOLED-black, multi-surface interfaces. The licence is MIT.

When your agent uses it

Tasks that involve Design systems
Tasks that involve Landing pages
Tasks that involve CSS and styling

Example prompts

“Use the atlas skill to atla — a design language and UI guide system for agent interfaces”
“/atlas”

Workflow steps

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

references/tokens.md — every CSS variable. Colors, spacing (4px
references/components.md — every .atlas-* class with HTML
references/patterns.md — 3-pane shell, content tone, icon rules
references/theming.md — dark/light toggle, shadcn variable alias
references/responsive.md — multi-surface patterns. Desktop vs
references/motion.md — motion inventory. 120ms hover, 200ms
references/lessons.md — 18 hard-won gotchas from real builds.
references/examples.md — copy-ready composition snippets from the

What it can do on your machine

Read from SKILL.md and the folder at commit bac5e27. 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

Atlas loads about 2.5k tokens when it runs, and up to ~17k if it reads all its reference files. Until then it costs about 150 tokens; SKILL.md has 1,003 words of instructions outside code blocks.

Always · name and description, kept in context so the agent knows when to use it: ~150
When it runs · the whole SKILL.md, loaded when a task matches: ~2.5k
With references · SKILL.md plus every file in references/, read only if the agent opens them: ~17k

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 pacifio/ui at commit bac5e27, republished under its MIT licence (© pacifio). 1,003 words, ~2,461 tokens.

Download SKILL.mdSave it as .claude/skills/atlas/SKILL.md (or your agent's skills folder). This skill also uses 59 other files; get the full folder from GitHub.

name: atlas
description: Atlas — a design language and UI guide system for agent interfaces. Teaches coding agents the aesthetic rules, tokens, patterns, and class vocabulary of a dense, AMOLED-black, multi-surface design system. Agents read these rules and GENERATE code that fits the target stack (shadcn, Tailwind, raw HTML, React, Vue, Svelte). The included colors_and_type.css is a reference implementation, not a required dependency. Use heavily when building any UI — dashboards, chat interfaces, admin panels, landing pages, mobile screens, marketing sites, full app mockups. Atlas is opinionated; lean into it.
version: 0.2.0
user-invocable: true
metadata.priority: 9
metadata.pathPatterns: **/*.css, **/components/**, **/ui/**, **/app/**, **/pages/**, **/design-system/**

Atlas — activation protocol

Atlas is a design language, not a CSS framework you bolt on. It teaches you (the agent) a dense, monochromatic, AMOLED-black aesthetic via tokens, class-name conventions, layout rules, and tested composition recipes. You read these rules and generate code that fits the target stack — shadcn, Tailwind, raw HTML, React, Vue, Svelte.

Use Atlas heavily. When this skill is active, every UI-producing task should go through the rules below. Don't freestyle. Don't invent new tokens. Don't pick random radii. The system is opinionated because opinions compound into coherence.

On activation: read these files in this order

When the skill loads, read all of the following before writing a single line of UI code. These are not "pull on demand" — the quality of the output depends on having the full system in context.

references/tokens.md — every CSS variable. Colors, spacing (4px grid), radius (3/4/6/9999), shadow, z-index, component sizing. This is the ground-truth values table. No token should be invented.
references/components.md — every .atlas-* class with HTML snippet and variants. The class name vocabulary you'll translate into the target stack.
references/patterns.md — 3-pane shell, content tone, icon rules (Lucide 1.5px stroke), button-vs-highlight color discipline.
references/theming.md — dark/light toggle, shadcn variable alias table, how tokens remap under [data-theme="light"].
references/responsive.md — multi-surface patterns. Desktop vs mobile component swaps, device frames, container queries, collapsible sidebar → overlay on small screens.
references/motion.md — motion inventory. 120ms hover, 200ms popover open, 300ms reveal, 60s marquee. Which animations are always-on vs gated behind prefers-reduced-motion.
references/lessons.md — 18 hard-won gotchas from real builds. Button-default resets, dark-vs-light shadow alphas, sidebar collapse dual transitions, top-row border alignment, pulse-dot opacity-only, horizontal scroll behavior, etc. Read this every time. Every one of these prevents a real regression.
references/examples.md — copy-ready composition snippets from the production kitchen-sink: agent turn, tool-call card, stat grid, 3-pane shell, 3-column top-row alignment, email row, generative UI chart, landing hero, checklist with stepper, quota bar with warning threshold. Start from one of these; don't freestyle compositions.

Then inspect (as needed, not upfront):

colors_and_type.css — reference implementation. Inspect rules to understand exact visual output.
preview/components-*.html — pre-built reference HTML per component.
ui_kits/generic_app/ — 3-pane shell reference.

Only after reading 1–8 should you start generating.

The three assets, three jobs

Asset	Job
`references/*.md`	Ground truth. The rules the agent follows. Read every time.
`.atlas-*` class names	Vocabulary. Your shorthand for "render X the Atlas way" — translate to the target stack.
`colors_and_type.css`	Reference implementation. Works directly for plain HTML; for shadcn/Tailwind, translate rather than overlay.

Never mechanically copy colors_and_type.css into a shadcn or heavy Tailwind project. Translate. The skill description and references/theming.md spell out the translation tables.

Ask the stack question before writing code

Plain HTML / no framework → use colors_and_type.css directly via <link rel="stylesheet">. Emit literal .atlas-* classes. This is the reference path, and the companion kitchen-sink site uses it.
Tailwind v4 → put Atlas tokens in an @theme block. Emit utility classes following the Atlas visual rules. Don't ship colors_and_type.css to the bundle.
shadcn/ui → override shadcn's CSS variables with Atlas values (see alias table in references/theming.md). Keep shadcn's component structure. Don't install .atlas-* classes alongside.
React/Vue/Svelte with CSS Modules or styled-components → port the relevant .atlas-* rule into the target styling system as a component. The rule in colors_and_type.css is the source; your emitted code is the translation.
Existing design system (Material, Chakra, etc.) → ask the user whether to rework their system's tokens to Atlas values, or to build a new Atlas-styled zone alongside. Don't mix the two on the same surface.

Show full SKILL.md (421 more words)Show less

Non-negotiable visual rules

Pulled forward from references/lessons.md — these apply regardless of stack:

AMOLED black canvas. #000 base, never dark gray.
Monochromatic surfaces. Grays + whites for structure; saturated color only for status semantics.
Near-white primary actions. #ededed fill, #fff on hover. Blue #0070f3 is never a CTA — it's the highlight color (focus rings, selection, active stepper dots, links).
4px spacing grid. 2px and 6px exist only for ultra-compact inline cases.
3 / 4 / 6 / 9999 radii. No inventing 8, 10, 12, 16.
28px buttons, 24px inputs, 13px base text. Don't inflate.
Borders over shadows. Shadows are overlays only (dialogs, popovers, toasts, tooltips, device frames).
1.5px Lucide icons. Never emoji, never unicode symbols.
120ms background-color transitions only. Don't animate color or opacity on icons.

Quick component vocabulary

Class names are guidance, not mandatory output. Translate them in non-plain-HTML stacks.

Primitives: .atlas-btn (+ -primary / -secondary / -ghost / -destructive / -icon / -sm / -lg), .atlas-btn-pill (+ same variants), .atlas-input (+ -sm), .atlas-checkbox, .atlas-radio, .atlas-switch, .atlas-kbd, .atlas-link

Surfaces: .atlas-card / -header / -body, .atlas-panel-header / .atlas-panel-title, .atlas-stat / -label / -value / -delta, .atlas-empty

Navigation: .atlas-tabbar + .atlas-tab, .atlas-tabbar-bottom + .atlas-tabbar-bottom-item, .atlas-segmented + -item, .atlas-toggle, .atlas-breadcrumb, .atlas-pagination, .atlas-stepper

Overlays: .atlas-popover + .atlas-menu-item, .atlas-dialog, .atlas-command, .atlas-tooltip, .atlas-toast, .atlas-alert

Data: .atlas-table, .atlas-list + .atlas-list-item, .atlas-badge, .atlas-pill, .atlas-dot (+ .is-pulse for animated status — opacity only, never glow), .atlas-accordion

Feedback: .atlas-progress, .atlas-slider, .atlas-skeleton, .atlas-titlebar, .atlas-statusbar

Identity: .atlas-avatar, .atlas-avatar-group, .atlas-divider / -v, .atlas-divider-dashed / -v-dashed

Multi-surface & motion: .atlas-device-mobile, .atlas-device-tablet, .atlas-device-desktop, .atlas-marquee, .atlas-filmstrip, .atlas-reveal, .atlas-display / -lg, .atlas-eyebrow

What was built with this skill

The companion kitchen-sink/ app was one-shot generated by an agent reading this skill, using the reference CSS because Next.js + no shadcn made that the natural path. It includes:

Homepage — display hero, marquee band, ~29 live component cards in a masonry grid, mockup tile row.
Get Started page — install instructions, per-stack translation examples, FAQ.
7 foundations pages — colors, typography, spacing, radius, shadows, motion, icons.
36 component pages — every .atlas-* class with preview + variants + inspector.
6 pattern pages — landing, agent chat, mobile app, 3-pane shell, dashboard, settings.
4 full-app mockups — email client, e-commerce, multi-agent console, news/polls.

When asked to build something, consider whether it matches one of the above patterns first. Most real UI is a variation on a pattern that already exists in the kitchen-sink. Start there, then customize.

No guidance given?

Ask the user:

What are they building? (dashboard, chat UI, landing page, mobile app…)
What's their stack? (Tailwind / shadcn / plain HTML / React with CSS Modules / etc.)
Dark only, light only, or both with toggle?

Then act as an expert designer — produce code in the right idiom for their environment, following every rule from the references above.

Files

SKILL.md and 59 other files (references) in skills/atlas of pacifio/ui.

SKILL.md
.DS_Store
colors_and_type.css
preview/_preview.css
preview/brand-logo.html
preview/colors-accent.html
preview/colors-backgrounds.html
preview/colors-borders.html
preview/colors-light.html
preview/colors-status.html
preview/colors-text.html
preview/components-accordion.html
preview/components-alert.html
preview/components-avatars.html
preview/components-badge.html
preview/components-breadcrumb.html
preview/components-buttons.html
preview/components-checkbox.html
preview/components-command.html
preview/components-dialog.html
… and 40 more

Open the folder on GitHubat commit bac5e27

Compare with similar skills

Atlas 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.

Atlas compared with similar skills
Skill	Stars	Used in	Tokens	Auto-check	Licence	Repo updated
Atlas this skillpacifio/ui	154	—	~2.5k	Automated safety check: Pass	MIT	5 mo ago
Design StyleCastor6/tactus	376	1 repos	~2.1k	Automated safety check: Pass	Apache-2.0	5 mo ago
Kill AI Slopyetone/kill-ai-slop	1.3k	—	~1.4k	Automated safety check: Pass	Apache-2.0	24 days ago
UI/UX Design System AdvisorGalaxy-Dawn/claude-scholar	5.7k	1 repos	~1.1k	Automated safety check: Pass	MIT	16 days ago
UI UX Pro Maxsundial-org/awesome-openclaw-skills	663	2 repos	~657	Automated safety check: Pass	None	7 mo ago
Tailwind CSS Patternsever-works/ever-works	162	3 repos	~1.6k	Automated safety check: Notes	AGPL-3.0	today

Similar skills

Design Style
Castor6/tactus
A skill your agent uses whenever the user asks to build, create, design, develop, improve, or style any frontend interface or visual element.
376 GitHub starsUsed in 1 repo~2.1k tokens
Frontend & DesignAuto-check passed
Kill AI Slop
yetone/kill-ai-slop
Find and remove AI slop — the generic, machine-default visual and copy tics of vibe-coded products — from a web project.
1.3k GitHub stars~1.4k tokensUpdated 24 days ago
Frontend & DesignAuto-check passed
UI/UX Design System Advisor
Galaxy-Dawn/claude-scholar
Turns a vague UI request into a concrete design system with style, palette, typography and layout guidance from a search script, plus stack-specific implementation advice.
5.7k GitHub starsUsed in 1 repo~1.1k tokens
Frontend & DesignAuto-check passed
UI UX Pro Max
sundial-org/awesome-openclaw-skills
UI/UX design intelligence and implementation guidance for building polished interfaces.
663 GitHub starsUsed in 2 repos~657 tokens
Frontend & DesignAuto-check passed
Tailwind CSS Patterns
ever-works/ever-works
Provides comprehensive Tailwind CSS utility-first styling patterns including responsive design, layout utilities, flexbox, grid, spacing, typography, colors, and modern CSS best practices.
162 GitHub starsUsed in 3 repos~1.6k tokens
Frontend & DesignAuto-check: notes
Tailwind To Stylex
shadcn-labs/shadcn-cssinjs
Migrate TailwindCSS to StyleX. An agent skill from shadcn-labs/shadcn-cssinjs.
123 GitHub stars~2.7k tokensUpdated 28 days ago
Frontend & DesignAuto-check passed

Works with

Questions about Atlas

What does Atlas do?

Atlas — a design language and UI guide system for agent interfaces. Atlas is an agent skill from pacifio/ui. Atlas — a design language and UI guide system for agent interfaces.

When should I use Atlas?

Atlas fits situations like: tasks that involve Design systems; tasks that involve Landing pages; tasks that involve CSS and styling.

How do I install Atlas in Claude Code?

Run `npx skills add pacifio/ui --skill atlas -a claude-code`. Or copy the skill folder (skills/atlas in pacifio/ui) into .claude/skills/atlas in your project. Claude Code loads it when a task matches its description.

How do I install Atlas in Codex?

Run `npx skills add pacifio/ui --skill atlas -a codex`. Or copy the skill folder (skills/atlas in pacifio/ui) into .agents/skills/atlas in your project. Codex loads it when a task matches its description.

Can I use Atlas 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 pacifio/ui --skill atlas -a cursor` (or -a gemini-cli, github-copilot or opencode for the others). To copy it by hand, put the folder in .cursor/skills/atlas, .gemini/skills/atlas, .github/skills/atlas and .opencode/skills/atlas in your project.

What does Atlas need to run?

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

Does Atlas 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 Atlas 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 Atlas use?

Atlas 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 Atlas use?

About 2.5k tokens (SKILL.md is roughly 9.8k characters). Agents keep only the skill's name and description in context until a task matches; then they load SKILL.md in full. Its references folder adds about 15k tokens, read only when the agent opens those files.

What are the alternatives to Atlas?

Skills that share tags, products or a category with Atlas: Design Style (Castor6/tactus, 376 stars), Kill AI Slop (yetone/kill-ai-slop, 1.3k stars), UI/UX Design System Advisor (Galaxy-Dawn/claude-scholar, 5.7k stars) and UI UX Pro Max (sundial-org/awesome-openclaw-skills, 663 stars). The comparison table on this page puts their stars, adoption, token cost, safety result and licence side by side.

Who maintains Atlas?

pacifio (a GitHub user) maintains it in pacifio/ui, which has 154 GitHub stars. The repository was last updated on April 24, 2026.

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

Install Atlas

Facts

At a glance

What it does

When your agent uses it

Example prompts

Workflow steps

What it can do on your machine

Tool permissions

Runs code

Network

Credentials

Context cost

Safety

SKILL.md

Atlas — activation protocol

On activation: read these files in this order

The three assets, three jobs

Ask the stack question before writing code

Non-negotiable visual rules

Quick component vocabulary

What was built with this skill

No guidance given?

Files

Compare with similar skills

Similar skills

Design Style

Kill AI Slop

UI/UX Design System Advisor

UI UX Pro Max

Tailwind CSS Patterns

Tailwind To Stylex

Related

Questions about Atlas