404-and-empty-state-design
Use when designing 404 pages and the broader empty-state pattern library.
Skill by x3allamerican
Chalk Labs
Need help deploying 404-and-empty-state-design?
Chalk Labs sets up agents like this inside real teams: connected to your tools, tested on your data, with a human in the loop where it matters.
Install
Works with Claude Code, Claude apps, Codex, Cursor, Gemini CLI, GitHub Copilot, VS Code, OpenCode, Goose, Windsurf. Read the repository before you give any tool access to your data.
npx agentmarket install skill/x3allamerican-404-and-empty-state-design
Asks which of your tools to add it to (Claude Code, Codex, Cursor, VS Code, Windsurf, Gemini CLI, Claude Desktop) and shows the change first. See https://agentmart.dev/cli.
Get the weekly diff
The weekly diff: one email a week with new agent tools, notable updates and grade changes, plus security alerts for tools you follow. Double opt-in, one-click unsubscribe.
About
Use cases: design, data, writing
Reviews
Write a reviewNo reviews yet. Installed it? Reviews come from verified installers only. How reviews work
Permissions
What this skill can do and what it asks for, from its SKILL.md. Checked Oct 25, 2026.
- Tools
- No tools found
- Secrets
- None asked for
- Install scripts
- None found
Network hosts it talks to 1
codeload.github.com· found in install command
Files it touches
~/.claude/skills/404-and-empty-state-design
What's inside
- Skill name
404-and-empty-state-design- Description
- Use when designing 404 pages and the broader empty-state pattern library. Covers tone, illustration, search recovery, and the difference between 'no data yet' and 'this URL doesn't exist'.
- License
- Apache-2.0
- Instructions
- 28 lines in SKILL.md · view on GitHub
Files (1)
- SKILL.md
SKILL.md (first lines)
# 404 And Empty State Design
Empty states are pre-content moments. Done well, they guide the user. Done badly, they feel broken.
## 404 page basics
Headline ('Page not found' — clear). Optional illustration (40-80% of brands include one). Site nav still visible. Primary CTAs: search + 'Go to home' + 'Contact support'.
## Empty-state taxonomy
No data yet (new account) · Filter returned nothing · Search returned nothing · Permission denied · Error loading data. Each needs different treatment.
## No data yet pattern
Headline ('No drivers yet'). Subtext ('Add your first driver to get started'). Primary CTA. Optional illustration.
## Filter empty pattern
Show active filters. 'Clear all filters' button. Optionally 'Try X instead' suggestions.
## Common mistakes
404 page that hides the rest of the site. Empty state with no action. Same illustration on every empty state (lazy). Filter empty state that doesn't show what filters are applied.
## Where this fits in X3 Compass
Applied in the X3 Compass build via the relevant pages and components.From x3allamerican/design-skills-fleetsafety, Apache-2.0.
More from x3allamerican/design-skills-fleetsafety
- 0.462score
ab-test-design-rituals
x3allamerican
Use when designing A/B tests.
SkillCFreshness: CClaude Code +9 - 0.462score
accessibility-baseline
x3allamerican
Use when shipping any user-facing UI.
SkillCFreshness: CClaude Code +9 - 0.462score
accessibility-wcag-aaa
x3allamerican
Use when targeting WCAG AAA (highest accessibility tier).
SkillCFreshness: CClaude Code +9 - 0.462score
account-settings-design
x3allamerican
Use when designing account settings pages.
SkillCFreshness: CClaude Code +9 - 0.462score
ai-pair-design-workflows
x3allamerican
Use when working with AI as a design partner (Claude, GPT, Midjourney, v0).
SkillCFreshness: CClaude Code +9 - 0.462score
analytics-instrumentation-design
x3allamerican
Use when designing analytics instrumentation as a design discipline.
SkillCFreshness: CClaude Code +9 - 0.462score
brand-system-tokens
x3allamerican
Use when establishing or migrating to a token-based design system.
SkillCFreshness: CClaude Code +9 - 0.462score
brand-voice-in-interface
x3allamerican
Use when writing UI copy: button labels, error messages, empty states, onboarding text, tooltips.
SkillCFreshness: CClaude Code +9 - 0.462score
breach-notification-ui
x3allamerican
Use when designing the UI for a security breach notification (rare but high-stakes).
SkillCFreshness: CClaude Code +9 - 0.462score
bulk-action-ui-patterns
x3allamerican
Use when designing bulk actions on tables or lists.
SkillCFreshness: CClaude Code +9 - 0.462score
careers-page-design
x3allamerican
Use when designing a careers/jobs page.
SkillCFreshness: CClaude Code +9 - 0.462score
color-system-design
x3allamerican
Use when establishing a color system for a SaaS product, marketing site, or brand.
SkillCFreshness: CClaude Code +9
Signals
- Stars
- 0
- Forks
- 0
- Open issues
- 0
- Last commit (this folder)
- May 13, 2026 (5 months ago)
- Last release
- May 13, 2026 (5 months ago)
From GitHub (fetched Oct 24, 2026).
Details
- License
- Apache-2.0
- Website
- x3compass.com
- First seen
- Oct 24, 2026
- Last checked
- Oct 24, 2026
- Source
- GitHubgithub-graphql
More from x3allamerican
- 0.462score
accessibility-wcag-aaa
x3allamerican
Use when targeting WCAG AAA (highest accessibility tier).
SkillCFreshness: CClaude Code +9 - 0.462score
ai-pair-design-workflows
x3allamerican
Use when working with AI as a design partner (Claude, GPT, Midjourney, v0).
SkillCFreshness: CClaude Code +9 - 0.462score
ab-test-design-rituals
x3allamerican
Use when designing A/B tests.
SkillCFreshness: CClaude Code +9 - 0.462score
accessibility-baseline
x3allamerican
Use when shipping any user-facing UI.
SkillCFreshness: CClaude Code +9 - 0.462score
account-settings-design
x3allamerican
Use when designing account settings pages.
SkillCFreshness: CClaude Code +9 - 0.462score
analytics-instrumentation-design
x3allamerican
Use when designing analytics instrumentation as a design discipline.
SkillCFreshness: CClaude Code +9
Done for you
Rather not set it up yourself?
Chalk Labs scopes, builds and runs agents for your team: the task audit, the eval harness, the integrations and the weekly ops report. Fixed scope, priced before we start.
See how we build AI agents →Read the case studies
Chalk Labs is a two-founder AI and growth studio. We build AI agents, CRMs and MVPs for Web3 and AI companies, and have shipped 50+ product and token launches.
- launches shipped
- 50+
- launches shipped
- media placements
- 500+
- media placements
- founders on every account
- 2
- founders on every account
Press we've placed: Forbes · CoinDesk · Decrypt · Cointelegraph · The Block
Rahil Jain, Co-founder, Chalk Labs. Ex-Goldman Sachs engineer. You talk to the person who builds it.
Get 404-and-empty-state-design running in your business
Tell us what you want to automate. A founder replies within one working day with a plan, not a pitch deck.
Cite this page
404-and-empty-state-design skill. Agent Mart. https://agentmart.dev/skills/x3allamerican-404-and-empty-state-design (last updated 2026-10-24)