New: 98,000+ skills indexed from GitHub repos with 100+ stars · every skill safety-checkedBrowse top skillsTop skills
Esc to closeBrowse all skills
Submit a skillBrowse skills
Submit a skillBrowse skills

Agent skill

UI Craft Dense Dashboard

by educlopez in educlopez/ui-craft

Dense dashboard / admin / Bloomberg / Retool / data-heavy internal tools.

MITAuto-check passedData & Analytics

Install UI Craft Dense Dashboard

skills CLI
$ npx skills add educlopez/ui-craft --skill ui-craft-dense-dashboard -a claude-code

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

GitHub CLI
$ gh skill install educlopez/ui-craft ui-craft-dense-dashboard --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/educlopez/ui-craft.git skills-src && mkdir -p .claude/skills && cp -r skills-src/skills/ui-craft-dense-dashboard .claude/skills/ui-craft-dense-dashboard && 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
ui-craft-dense-dashboard
GitHub stars
376
Token cost
~1.4k tokens
SKILL.md length
661 words
Files
1
Skills in repo
13
Repo updated
First seen
Licence
MIT

At a glance

Dense dashboard / admin / Bloomberg / Retool / data-heavy internal tools.

  • Data & Analytics work in your project
  • SKILL.md covers Knobs (locked), Style anchors, Base rules (inherited) and Style-specific overrides, plus 2 more sections
  • Instructions only: no scripts, shell commands, URLs or credentials in SKILL.md

What it does

UI Craft Dense Dashboard is an agent skill from educlopez/ui-craft. Dense dashboard / admin / Bloomberg / Retool / data-heavy internal tools. Locked knobs: CRAFT=7, MOTION=3, DENSITY=9. IBM Plex + mono numbers, semantic palette, 4/8px grid, sparklines, tabular-nums. Trigger on: dashboard, admin panel, data-dense, analytics, Bloomberg-like, Retool-like.

Its SKILL.md is about 1.4k 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 Data & Analytics. The repository describes itself as: Design engineering system for AI coding agents — ship UI with craft-level quality. Install as an agent skill. The licence is MIT.

When your agent uses it

  • Data & Analytics work in your project

Example prompts

  • “/ui-craft-dense-dashboard”

What it can do on your machine

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

UI Craft Dense Dashboard loads about 1.4k tokens when it runs. Until then it costs about 78 tokens; SKILL.md has 661 words of instructions outside code blocks.

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

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 educlopez/ui-craft at commit ceecc8e, republished under its MIT licence (© educlopez). 661 words, ~1,353 tokens.

Download SKILL.mdSave it as .claude/skills/ui-craft-dense-dashboard/SKILL.md (or your agent's skills folder).
name
ui-craft-dense-dashboard
description
Dense dashboard / admin / Bloomberg / Retool / data-heavy internal tools. Locked knobs: CRAFT=7, MOTION=3, DENSITY=9. IBM Plex + mono numbers, semantic palette, 4/8px grid, sparklines, tabular-nums. Trigger on: dashboard, admin panel, data-dense, analytics, Bloomberg-like, Retool-like.
argument-hint
[action: build|review|polish] [target]

UI Craft — Dense Dashboard

Pre-committed dense style: data-first, keyboard-first, operator tools. Bloomberg, Retool, Linear issues view, admin panels. Every pixel earns its place.

Knobs (locked)

  • CRAFT_LEVEL = 7 — polished but not precious; operators value speed over sheen.
  • MOTION_INTENSITY = 3 — micro-only. Row hover, row active tint, inline confirm. No scroll reveals in table areas.
  • VISUAL_DENSITY = 9 — tight 4/8px grid; whitespace earns its place.

Do not re-ask these in Discovery. Confirm brand accent + dark/light preference only.

Style anchors

  • UI sans + mono pairing. Mono for every ID, hash, timestamp, code.
  • Semantic palette required: success, warning, danger, info + one brand accent.
  • tabular-nums on every numeric column; mono on identifiers.
  • Tight 4/8px spacing grid. px-3 py-2 table cells, gap-2 toolbars.
  • Sparklines everywhere; horizontal bars for categorical; area for time-series. No pie. No 3D.
  • Keyboard shortcuts visible inline (⌘K, J/K, E to edit).
  • Dense chrome: breadcrumbs + tabs + toolbars + filter chips are welcome.
  • Micro-motion only. Row hover, row active, inline save. No entrance stagger.

Base rules (inherited)

All rules in ../ui-craft/SKILL.md apply. This file overrides knob defaults and adds style-specific guidance below. The anti-slop and craft tests still apply in full.

Style-specific overrides

Typography

  • UI: IBM Plex Sans or Inter, 400 / 500.
  • Mono: IBM Plex Mono or Geist Mono for IDs, hashes, timestamps, code, version numbers, kbd.
  • Body size: 13-14px default; 12px in dense tables is fine.
  • tabular-nums on every numeric column, metric card, timestamp, duration.
  • font-variant-numeric: tabular-nums slashed-zero for IDs + codes.
  • Headings: compact. Page title 18-20px, section 14-15px 500.

Color (semantic palette required)

  • Brand accent: one — primary actions, active tab, selected row accent tint.
  • Semantic, subdued OKLCH (lightness 50-60, chroma ≤ 0.15):
    • success oklch(60% 0.12 150)
    • warning oklch(72% 0.13 75)
    • danger oklch(58% 0.15 25)
    • info oklch(62% 0.12 240)
  • Never saturated hues — dashboards live on screens for 8 hours.
  • Status dots, badge text, chip text use semantic color; backgrounds stay neutral.

Spacing & layout

  • 4/8px spacing scale — never 5, 7, 9, 10. Stick to 4 / 8 / 12 / 16 / 24.
  • Table cells: px-3 py-2 default; px-2 py-1.5 for ultra-dense.
  • Toolbar rows: gap-2, h-9 controls, text-sm.
  • Sidebar: narrow (200-240px), subtle bg tint, icon + label; never full dark.
  • Cards: p-4, 8px radius; 1px border over shadow.

Data display

  • Every number column: tabular-nums + right-aligned.
  • Every ID / hash / commit / timestamp: monospace.
  • Sparklines inline in rows for trend context. 24-40px tall, single color.
  • Category charts: horizontal bars. Time-series: area with 15% → 0% fade. No pies.
  • Deltas: plain text +12.5% in semantic color, no pill.
  • Empty states: one-line hint + keyboard shortcut to create.
Show full SKILL.md (255 more words)Show less

Chrome & navigation

  • Breadcrumbs + tabs + sub-toolbar together is expected and fine.
  • Filter chips: outline style, removable ×, no pill fill.
  • Global command palette: ⌘K visible in header search affordance.
  • Row actions: inline icons on hover; also available via keyboard.
  • Pagination: text Page 3 of 42 + tabular-nums, plus J/K navigation.

Motion

  • Row hover: background shift to oklch(96% 0.002 250) light / oklch(20% 0.005 250) dark, 80ms.
  • Active/selected row: brand accent tint at ~6% opacity + 2px accent left border.
  • Inline save / confirm: 150ms fade + check icon swap.
  • No scroll-triggered reveals in table areas — they stutter long lists.
  • Sort arrow, filter open, column resize: instant or <100ms.

Reference files to read first

Load these from ../ui-craft/references/:

  • dashboard.md — primary reference; metric cards, charts, sidebar, tables
  • typography.md — tabular-nums, mono pairing, scale
  • motion.md Rendering Performance — compositor pipeline, layer promotion, scroll-linked motion
  • responsive.md — tablet + laptop breakpoints, toolbar collapse

Skip inspiration.md (landing-page focused), sound.md.

Anti-patterns for THIS style

  • Serif fonts anywhere in chrome or data. Editorial is a different variant.
  • Proportional figures in numeric columns — always tabular-nums.
  • Saturated hues — reads as consumer app, not operator tool.
  • Colored pills on every delta — plain text in semantic color.
  • Pie charts, donut charts, 3D charts. Ever.
  • Vertical bar chart for time-series — use area/line.
  • Uniform colored top borders on metric cards.
  • Card grids with heavy whitespace — if it feels airy, wrong variant.
  • Full-dark sidebar (common AI pattern) — subtle tint only.
  • Scroll-triggered reveals or stagger animations in table areas.
  • Hidden keyboard shortcuts — always surface ⌘K, row shortcuts, help trigger.
  • Vague loading states — show skeleton rows matching column structure, not generic spinner.

© educlopez, 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 skills/ui-craft-dense-dashboard of educlopez/ui-craft.

Open the folder on GitHubat commit ceecc8e

Compare with similar skills

UI Craft Dense Dashboard 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.

UI Craft Dense Dashboard compared with similar skills
SkillStarsUsed inTokensAuto-checkLicenceRepo updated
UI Craft Dense Dashboard this skilleduclopez/ui-craft376—~1.4kAutomated safety check: PassMIT
MatplotlibzLanqing/codex-claude-academic-skills4.7k17 repos~2.9kAutomated safety check: PassMIT
Exploratory Data Analysisspacering-net/codeg3.9k14 repos~3.6kAutomated safety check: PassMIT
Scikit LearnzLanqing/codex-claude-academic-skills4.7k16 repos~3.9kAutomated safety check: PassBSD-3-Clause
Chart Visualizationbytedance/deer-flow84k1 repos~840Automated safety check: PassMIT
TimesFM Forecastinggoogle-research/timesfm34k—~4.7kAutomated safety check: PassApache-2.0

Similar skills

  • Matplotlib

    zLanqing/codex-claude-academic-skills

    Low-level plotting library for full customization. An agent skill from zLanqing/codex-claude-academic-skills.

    4.7k GitHub starsUsed in 17 repos~2.9k tokens
    Data & AnalyticsAuto-check passed

  • Exploratory Data Analysis

    spacering-net/codeg

    Perform comprehensive exploratory data analysis on scientific data files across 200+ file formats.

    3.9k GitHub starsUsed in 14 repos~3.6k tokens
    Data & AnalyticsAuto-check passed

  • Scikit Learn

    zLanqing/codex-claude-academic-skills

    Machine learning in Python with scikit-learn. An agent skill from zLanqing/codex-claude-academic-skills.

    4.7k GitHub starsUsed in 16 repos~3.9k tokens
    Data & AnalyticsAuto-check passed

  • Chart Visualization

    bytedance/deer-flow

    Picks a suitable chart type from 26 options for your data, maps the data to that chart's parameters and generates a chart image through a JavaScript script.

    84k GitHub starsUsed in 1 repo~840 tokens
    Data & AnalyticsAuto-check passed

  • TimesFM Forecasting

    google-research/timesfm

    Forecasts any univariate time series zero-shot with Google's TimesFM model, returning point forecasts and calibrated prediction intervals without training.

    34k GitHub stars~4.7k tokensUpdated 10 days ago
    Data & AnalyticsAuto-check passed

  • Sandbox Bench

    vercel/next.js

    Official

    Benchmark React or Next.js changes on Vercel Sandbox VMs with paired A/B statistics: react PR/commit vs base, or Next.js PR/commit vs base, measured end-to-end through the bench/render-pipeline app…

    143k GitHub stars~4.1k tokensUpdated today
    Data & AnalyticsAuto-check passed

More from educlopez/ui-craft

All 13 skills in this repo

  • Finalize

    educlopez/ui-craft

    Pre-ship gate — runs detector, verifies brief and tokens, applies the 10-pass finish bar, ranks findings by feedback hierarchy.

    376 GitHub stars~1.9k tokensUpdated 1 mo ago
    Auto-check passed

  • Friction Log

    educlopez/ui-craft

    File contributor or agent papercuts as GitHub issues labeled friction, or investigate those issues as the daily friction-log Cloud Agent.

    376 GitHub stars~1.6k tokensUpdated 1 mo ago
    Auto-check passed

  • Remember

    educlopez/ui-craft

    Record a learned design constraint from a correction into the project brief.

    376 GitHub stars~585 tokensUpdated 1 mo ago
    Auto-check passed

  • Sddesign

    educlopez/ui-craft

    Full spec-driven pipeline — walks brief → tokens → shape (spec) → craft (build) → converge → ship in one guided run.

    376 GitHub stars~1.5k tokensUpdated 1 mo ago
    Auto-check passed

  • Start

    educlopez/ui-craft

    Front door. An agent skill from educlopez/ui-craft.

    376 GitHub stars~1.5k tokensUpdated 1 mo ago
    Auto-check passed

  • Tokens

    educlopez/ui-craft

    Audit or establish the project's 3-layer token spine. An agent skill from educlopez/ui-craft.

    376 GitHub stars~1.4k tokensUpdated 1 mo ago
    Auto-check passed

Categories

Questions about UI Craft Dense Dashboard

What does UI Craft Dense Dashboard do?

Dense dashboard / admin / Bloomberg / Retool / data-heavy internal tools. UI Craft Dense Dashboard is an agent skill from educlopez/ui-craft. Dense dashboard / admin / Bloomberg / Retool / data-heavy internal tools.

When should I use UI Craft Dense Dashboard?

UI Craft Dense Dashboard fits situations like: data & Analytics work in your project.

How do I install UI Craft Dense Dashboard in Claude Code?

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

How do I install UI Craft Dense Dashboard in Codex?

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

Can I use UI Craft Dense Dashboard 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 educlopez/ui-craft --skill ui-craft-dense-dashboard -a cursor` (or -a gemini-cli, github-copilot or opencode for the others). To copy it by hand, put the folder in .cursor/skills/ui-craft-dense-dashboard, .gemini/skills/ui-craft-dense-dashboard, .github/skills/ui-craft-dense-dashboard and .opencode/skills/ui-craft-dense-dashboard in your project.

What does UI Craft Dense Dashboard need to run?

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

Does UI Craft Dense Dashboard 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 UI Craft Dense Dashboard 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 UI Craft Dense Dashboard use?

UI Craft Dense Dashboard 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 UI Craft Dense Dashboard use?

About 1.4k tokens (SKILL.md is roughly 5.4k 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 UI Craft Dense Dashboard?

Skills that share tags, products or a category with UI Craft Dense Dashboard: Matplotlib (zLanqing/codex-claude-academic-skills, 4.7k stars), Exploratory Data Analysis (spacering-net/codeg, 3.9k stars), Scikit Learn (zLanqing/codex-claude-academic-skills, 4.7k stars) and Chart Visualization (bytedance/deer-flow, 84k stars). The comparison table on this page puts their stars, adoption, token cost, safety result and licence side by side.

Who maintains UI Craft Dense Dashboard?

educlopez (a GitHub user) maintains it in educlopez/ui-craft, which has 376 GitHub stars. The repository holds 13 skills in this directory. The repository was last updated on September 3, 2026.

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