Render agent findings as a styled HTML report in the browser.

MITAuto-check: notesProductivity & Automation

Install Atlas Report

skills CLI
$ npx skills add jeremylongshore/tons-of-skills-marketplace --skill atlas-report -a claude-code

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

GitHub CLI
$ gh skill install jeremylongshore/tons-of-skills-marketplace atlas-report --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/jeremylongshore/tons-of-skills-marketplace.git skills-src && mkdir -p .claude/skills && cp -r skills-src/plugins/ai-agency/tonone/skills/atlas-report .claude/skills/atlas-report && 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
atlas-report
GitHub stars
2.8k
Token cost
~2.1k tokens
SKILL.md length
552 words
Files
2
Skills in repo
3,342
Repo updated
First seen
Licence
MIT

At a glance

Render agent findings as a styled HTML report in the browser.

  • Works in 5 steps: Gather Context → Structure the Findings → Generate the HTML Report → …
  • Asked for full report
  • SKILL.md covers Steps and Key Rules
  • Reaches cdn.jsdelivr.net

What it does

Atlas Report is an agent skill from jeremylongshore/tons-of-skills-marketplace. Render agent findings as a styled HTML report in the browser. Use when asked for "full report", "detailed report", "show in browser", or when CLI output exceeds the 40-line budget.

Its SKILL.md is about 2.1k tokens, which your agent loads only when the skill is triggered. The skill folder holds 2 other files (for example `.claude-plugin/plugin.json`).

It sits in Productivity & Automation, covering Browser automation. The repository describes itself as: Model-agnostic agent-skills platform with a harness-free canonical layer, verified adapters, and the ccpi package manager. Explore at tonsofskills.com. The licence is MIT.

When your agent uses it

  • Asked for full report
  • Detailed report
  • Show in browser
  • CLI output exceeds the 40-line budget

Example prompts

  • “full report”
  • “detailed report”
  • “show in browser”
  • “/atlas-report”

Requirements

  • Pre-approved tools (allowed-tools): Read, Write, Edit, Bash, Glob, Grep, WebFetch, WebSearch, Task, TodoWrite, AskUserQuestion

Workflow steps

5 steps, taken from the step headings in SKILL.md.

  1. Gather Context
  2. Structure the Findings
  3. Generate the HTML Report
  4. Save and Open
  5. Present CLI Summary

What it can do on your machine

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

  • Tool permissions

    Pre-approves these tools, so the agent can use them without asking each time:

    • Read
    • Write
    • Edit
    • Bash
    • Glob
    • Grep
    • WebFetch
    • WebSearch
    • Task
    • TodoWrite

    …and 1 more on the same allowed-tools line.

    From allowed-tools in the SKILL.md frontmatter.

  • Runs code

    No scripts in the folder and no shell commands in SKILL.md (its code samples are css and html).

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

  • Network

    Hosts in commands or code, which the agent is likely to contact:

    • cdn.jsdelivr.net

    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 Report loads about 2.1k tokens when it runs. Until then it costs about 48 tokens; SKILL.md has 552 words of instructions outside code blocks.

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

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: notes

The automated check noted patterns worth knowing about, such as sudo or a known installer.

  • NotePre-approves every shell command (allowed-tools: Bash)SKILL.md
    allowed-tools: Read, Write, Edit, Bash, Glob, Grep, WebFetch, WebSearch, Task, TodoWrite, AskUserQuestion

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 jeremylongshore/tons-of-skills-marketplace at commit cfae287, republished under its MIT licence (© jeremylongshore). 552 words, ~2,135 tokens.

Download SKILL.mdSave it as .claude/skills/atlas-report/SKILL.md (or your agent's skills folder). This skill also uses 1 other file; get the full folder from GitHub.
name
atlas-report
description
Render agent findings as a styled HTML report in the browser. Use when asked for "full report", "detailed report", "show in browser", or when CLI output exceeds the 40-line budget.
allowed-tools
Read, Write, Edit, Bash, Glob, Grep, WebFetch, WebSearch, Task, TodoWrite, AskUserQuestion
version
0.6.4
author
tonone-ai <hello@tonone.ai>
license
MIT

Render HTML Report

You are Atlas — the knowledge engineer on the Engineering Team.

Follow the output format defined in docs/output-kit.md — 40-line CLI max, box-drawing skeleton, unified severity indicators, compressed prose.

Steps

Step 0: Gather Context

Determine what to report on. Sources (in priority order):

  1. Conversation context — recent agent output, findings, or analysis in this session
  2. Explicit request — user specifies a file, skill output, or topic
  3. Recent files — check for recent analysis artifacts in the repo

Identify and record:

  • Agent — which agent produced the findings (e.g., Forge, Warden, Spine)
  • Skill — which skill was run (e.g., forge-audit, warden-recon)
  • Repository — the target repo name and path
  • Timestamp — current date and time

If context is ambiguous, ask the user what they want reported before proceeding.

Step 1: Structure the Findings

Organize the gathered data into sections. Only include sections that have content — omit empty sections entirely.

  1. Header — agent name, skill name, timestamp, target repo/service
  2. Executive Summary — 3-5 bullet points capturing the key takeaways
  3. Findings — individual findings with:
    • Severity indicator: ■ CRITICAL, ▲ WARNING, or ● INFO
    • Evidence with file paths and line numbers where applicable
    • Recommended fix or action
  4. Metrics — tables, comparisons, scores, counts (e.g., dependency counts, coverage percentages, cost breakdowns)
  5. Diagrams — Mermaid diagrams for system relationships, data flows, or architecture
  6. Timeline — chronological events (useful for audits, incidents, migration histories)
  7. Actions — prioritized next steps, ordered by impact
Step 2: Generate the HTML Report

Generate a single self-contained HTML file with the following requirements:

Core constraints:

  • Zero external dependencies — all CSS and JS inline — except Mermaid CDN for diagrams
  • Dark theme by default with light theme toggle (top-right button)
  • Sticky navigation sidebar (left) with section links
  • Responsive layout — sidebar collapses to hamburger menu on mobile
  • Print stylesheet via @media print: hide sidebar, remove dark theme, expand all collapsed sections

Severity cards — color-coded:

  • ■ CRITICAL — red (#dc2626 dark, #fef2f2 light background)
  • ▲ WARNING — amber (#d97706 dark, #fffbeb light background)
  • ● INFO — blue (#2563eb dark, #eff6ff light background)

Interactive elements:

  • Collapsible <details><summary> for verbose data sections
  • Copy button on <pre> blocks only — appears on hover, hidden by default. Never on inline <code> elements — inline code is for reading, not copying
  • Mermaid JS CDN (https://cdn.jsdelivr.net/npm/mermaid/dist/mermaid.min.js) for rendering diagrams, with graceful degradation to plain code blocks if CDN is unavailable

Copy button implementation:

css
pre {
  position: relative;
}
pre .copy-btn {
  position: absolute;
  top: 0.5rem;
  right: 0.5rem;
  opacity: 0;
  transition: opacity 0.15s;
  padding: 0.2rem 0.5rem;
  font-size: 0.7rem;
  background: var(--bg-card);
  border: 1px solid var(--border);
  border-radius: 4px;
  cursor: pointer;
  color: var(--text-muted);
}
pre:hover .copy-btn {
  opacity: 1;
}
pre .copy-btn.copied {
  color: var(--success);
}

CSS design tokens:

css
:root {
  --bg: #0a0f1e;
  --bg-card: #111827;
  --bg-card-hover: #1a2236;
  --text: #e2e8f0;
  --text-muted: #64748b;
  --border: #1e2d45;
  --border-subtle: #162032;
  --accent: #3b82f6;
  --critical: #ef4444;
  --critical-bg: oklch(20% 0.05 25);
  --warning: #f59e0b;
  --warning-bg: oklch(20% 0.05 80);
  --info: #3b82f6;
  --info-bg: oklch(20% 0.05 240);
  --success: #22c55e;
  --radius: 8px;
  --radius-sm: 4px;
  --font-mono: "JetBrains Mono", "Fira Code", ui-monospace, monospace;
  --font-sans: "Inter", system-ui, -apple-system, sans-serif;
}
[data-theme="light"] {
  --bg: #f8fafc;
  --bg-card: #ffffff;
  --bg-card-hover: #f1f5f9;
  --text: #0f172a;
  --text-muted: #64748b;
  --border: #e2e8f0;
  --border-subtle: #f1f5f9;
  --critical-bg: #fef2f2;
  --warning-bg: #fffbeb;
  --info-bg: #eff6ff;
}

Typography and spacing:

css
body {
  font-family: var(--font-sans);
  font-size: 14px;
  line-height: 1.6;
}
h1 {
  font-size: 1.5rem;
  font-weight: 700;
  letter-spacing: -0.02em;
}
h2 {
  font-size: 1.1rem;
  font-weight: 600;
  letter-spacing: -0.01em;
}
h3 {
  font-size: 0.9rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--text-muted);
}
code {
  font-family: var(--font-mono);
  font-size: 0.85em;
  padding: 0.1em 0.3em;
  border-radius: var(--radius-sm);
  background: var(--border-subtle);
}
pre {
  border-radius: var(--radius);
  padding: 1.25rem;
  overflow-x: auto;
  background: var(--bg-card);
  border: 1px solid var(--border);
}
pre code {
  background: none;
  padding: 0;
}

Finding card design — minimal, whitespace-forward:

css
.finding {
  border-radius: var(--radius);
  border: 1px solid var(--border);
  padding: 1.25rem 1.5rem;
  margin-bottom: 1rem;
  background: var(--bg-card);
}
.finding-header {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  margin-bottom: 0.75rem;
}
.badge {
  font-size: 0.7rem;
  font-weight: 700;
  letter-spacing: 0.06em;
  padding: 0.15rem 0.5rem;
  border-radius: 3px;
  text-transform: uppercase;
}
.badge-critical {
  background: var(--critical-bg);
  color: var(--critical);
}
.badge-warning {
  background: var(--warning-bg);
  color: var(--warning);
}
.badge-info {
  background: var(--info-bg);
  color: var(--info);
}
.finding-title {
  font-weight: 600;
  font-size: 0.95rem;
}
.finding-body {
  color: var(--text-muted);
  font-size: 0.875rem;
}
.finding-fix {
  margin-top: 0.75rem;
  padding-top: 0.75rem;
  border-top: 1px solid var(--border-subtle);
  font-size: 0.875rem;
}

HTML structure skeleton:

html
<!DOCTYPE html>
<html lang="en" data-theme="dark">
  <head>
    ...
  </head>
  <body>
    <nav class="sidebar"><!-- section links --></nav>
    <main>
      <header><!-- agent, skill, timestamp, target --></header>
      <section id="summary">...</section>
      <section id="findings">...</section>
      <section id="metrics">...</section>
      <section id="diagrams">...</section>
      <section id="timeline">...</section>
      <section id="actions">...</section>
    </main>
    <script>
      /* theme toggle, copy buttons, mermaid init */
    </script>
  </body>
</html>
Show full SKILL.md (160 more words)Show less
Step 3: Save and Open
  1. Save the HTML file to {repo}/.reports/{agent}-{skill}-{YYYY-MM-DD-HHmm}.html
  2. Create the .reports/ directory if it does not exist
  3. Open the report in the default browser:
    • macOS: open {path}
    • Linux: xdg-open {path}
Step 4: Present CLI Summary
╭─ ATLAS ── atlas-report ───────────────────────╮

  ## Report generated

  **Source:** {agent} / {skill}
  **Target:** {repo or service name}
  **Saved:** .reports/{agent}-{skill}-{YYYY-MM-DD-HHmm}.html

  ### Contents
  - Executive Summary ({N} bullets)
  - Findings ({N} critical, {N} warning, {N} info)
  - Metrics ({N} tables)
  - Diagrams ({N} charts)
  - Actions ({N} next steps)

  → Opened in browser

╰────────────────────────────────────────────────╯

Key Rules

  • Self-contained HTML — the report must work offline (except Mermaid CDN for diagrams)
  • Never truncate findings in the HTML report — this is where full detail lives; the CLI summary is the compressed version
  • Severity colors match output kit — ■ red, ▲ amber, ● blue, consistent across CLI and HTML
  • Graceful Mermaid degradation — if CDN is unreachable, diagrams fall back to styled code blocks
  • Omit empty sections — do not render sections that have no content
  • No Tonone branding — no footer attribution, no "powered by", no agent author credit in the rendered HTML. The report belongs to the repo, not the tool
  • No copy buttons on inline code — copy buttons on <pre> blocks only, hover-reveal only. Inline <code> never gets a copy button

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

Files

SKILL.md and 1 other file in plugins/ai-agency/tonone/skills/atlas-report of jeremylongshore/tons-of-skills-marketplace.

  • SKILL.md
  • .claude-plugin/plugin.json

Open the folder on GitHubat commit cfae287

Compare with similar skills

Atlas Report 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 Report compared with similar skills
SkillStarsUsed inTokensAuto-checkLicenceRepo updated
Atlas Report this skilljeremylongshore/tons-of-skills-marketplace2.8k—~2.1kAutomated safety check: NotesMIT
Agent Browserquran/quran.com-frontend-next1.9k40 repos~3.3kAutomated safety check: PassNone
Dev-Browser CLI AutomationSawyerHood/dev-browser6.7k1 repos~455Automated safety check: PassMIT
Browser Automationopenclaw/openclaw392k—~2.9kAutomated safety check: PassMIT
Camoufox CLIBin-Huang/camoufox-cli3501 repos~4.5kAutomated safety check: PassMIT
BrowserVibiumDev/vibium2.9k—~4.8kAutomated safety check: PassApache-2.0

Similar skills

  • Agent Browser

    quran/quran.com-frontend-next

    Automates browser interactions for web testing, form filling, screenshots, and data extraction.

    1.9k GitHub starsUsed in 40 repos~3.3k tokens
    Productivity & AutomationAuto-check passed
  • Dev-Browser CLI Automation

    SawyerHood/dev-browser

    Browser automation with persistent named pages via the dev-browser CLI. Use when users ask to navigate websites, fill forms, take screenshots, extract web…

    6.7k GitHub starsUsed in 1 repo~455 tokens
    Productivity & AutomationAuto-check passed
  • Browser Automation

    openclaw/openclaw

    A skill your agent uses when controlling web pages with the OpenClaw browser tool, especially multi-step flows, login checks, tab management, or recovery from stale refs/timeouts.

    392k GitHub stars~2.9k tokensUpdated today
    Productivity & AutomationAuto-check passed
  • Camoufox CLI

    Bin-Huang/camoufox-cli

    Anti-detect browser automation CLI & Skills for AI agents. An agent skill from Bin-Huang/camoufox-cli.

    350 GitHub starsUsed in 1 repo~4.5k tokens
    Productivity & AutomationAuto-check passed
  • Browser

    VibiumDev/vibium

    Automate browsers with the Vibium CLI. An agent skill from VibiumDev/vibium.

    2.9k GitHub stars~4.8k tokensUpdated yesterday
    Productivity & AutomationAuto-check passed
  • Test AIRI display-model imports with agent-browser across stage-tamagotchi Electron, stage-web, and stage-pocket mobile web layouts.

    50k GitHub stars~1.1k tokensUpdated today
    Productivity & AutomationAuto-check passed

More from jeremylongshore/tons-of-skills-marketplace

All 3,342 skills in this repo
  • Performing Security Code Review

    jeremylongshore/tons-of-skills-marketplace

    Execute this skill enables AI assistant to conduct a security-focused code review using the security-agent plugin.

    2.8k GitHub starsUsed in 2 repos~1.3k tokens
    Auto-check: notes
  • Adapting Transfer Learning Models

    jeremylongshore/tons-of-skills-marketplace

    Build this skill automates the adaptation of pre-trained machine learning models using transfer learning techniques.

    2.8k GitHub stars~1.1k tokensUpdated today
    Auto-check passed
  • Agent Context Loader

    jeremylongshore/tons-of-skills-marketplace

    Execute proactive auto-loading: automatically detects and loads agents.md files.

    2.8k GitHub stars~1.1k tokensUpdated today
    Auto-check passed
  • Aggregating Performance Metrics

    jeremylongshore/tons-of-skills-marketplace

    Aggregate and centralize performance metrics from applications, systems, databases, caches, and services.

    2.8k GitHub stars~1.2k tokensUpdated today
    Auto-check passed
  • Analyzing Capacity Planning

    jeremylongshore/tons-of-skills-marketplace

    Execute this skill enables AI assistant to analyze capacity requirements and plan for future growth.

    2.8k GitHub stars~947 tokensUpdated today
    Auto-check passed
  • Analyzing Database Indexes

    jeremylongshore/tons-of-skills-marketplace

    Process use when you need to work with database indexing. An agent skill from jeremylongshore/tons-of-skills-marketplace.

    2.8k GitHub stars~2k tokensUpdated today
    Auto-check passed

Questions about Atlas Report

What does Atlas Report do?

Render agent findings as a styled HTML report in the browser. Atlas Report is an agent skill from jeremylongshore/tons-of-skills-marketplace. Render agent findings as a styled HTML report in the browser.

When should I use Atlas Report?

Atlas Report fits situations like: asked for full report; detailed report; show in browser; CLI output exceeds the 40-line budget.

How do I install Atlas Report in Claude Code?

Run `npx skills add jeremylongshore/tons-of-skills-marketplace --skill atlas-report -a claude-code`. Or copy the skill folder (plugins/ai-agency/tonone/skills/atlas-report in jeremylongshore/tons-of-skills-marketplace) into .claude/skills/atlas-report in your project. Claude Code loads it when a task matches its description.

How do I install Atlas Report in Codex?

Run `npx skills add jeremylongshore/tons-of-skills-marketplace --skill atlas-report -a codex`. Or copy the skill folder (plugins/ai-agency/tonone/skills/atlas-report in jeremylongshore/tons-of-skills-marketplace) into .agents/skills/atlas-report in your project. Codex loads it when a task matches its description.

Can I use Atlas Report 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 jeremylongshore/tons-of-skills-marketplace --skill atlas-report -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-report, .gemini/skills/atlas-report, .github/skills/atlas-report and .opencode/skills/atlas-report in your project.

What does Atlas Report need to run?

SKILL.md names no scripts, command-line tools or credentials: Atlas Report is instructions for the agent only. Its frontmatter pre-approves these tools: Read, Write, Edit, Bash, Glob, Grep, WebFetch, WebSearch, Task, TodoWrite, AskUserQuestion.

Does Atlas Report access the network?

SKILL.md names 1 domain. In commands or code: cdn.jsdelivr.net; the agent is likely to contact it when it follows the instructions. This is read from the text; nothing was executed.

Is Atlas Report safe to install?

Our automated static check of SKILL.md found notes only (pre-approves every shell command (allowed-tools: bash)), nothing it rates as a warning. It is not a guarantee. Review the folder before installing.

What licence does Atlas Report use?

Atlas Report is published under the MIT licence (declared in SKILL.md). It allows redistribution, so the full SKILL.md is shown on this page.

How many tokens does Atlas Report use?

About 2.1k tokens (SKILL.md is roughly 8.5k 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 Atlas Report?

Skills that share tags, products or a category with Atlas Report: Agent Browser (quran/quran.com-frontend-next, 1.9k stars), Dev-Browser CLI Automation (SawyerHood/dev-browser, 6.7k stars), Browser Automation (openclaw/openclaw, 392k stars) and Camoufox CLI (Bin-Huang/camoufox-cli, 350 stars). The comparison table on this page puts their stars, adoption, token cost, safety result and licence side by side.

Who maintains Atlas Report?

jeremylongshore (a GitHub user) maintains it in jeremylongshore/tons-of-skills-marketplace, which has 2,827 GitHub stars. The repository holds 3,342 skills in this directory. The repository was last updated on October 10, 2026.

Source: jeremylongshore/tons-of-skills-marketplace on GitHub. Facts on this page come from the repository at the commit we read; the author's words are quoted as theirs.