Skip to content

feat(claude-tty): draw the provider icon as Claude's spark with a terminal badge - #152

Merged
sleeyax merged 6 commits into
mainfrom
feat/claude-tty-icon
Oct 12, 2026
Merged

sleeyax merged 6 commits into
mainfrom
feat/claude-tty-icon

Conversation

@sleeyax

@sleeyax sleeyax commented Oct 12, 2026 •

Copy link
Copy Markdown
Owner

Summary

Replaces the placeholder terminal icon with Claude's spark and a terminal badge: Claude, running in a TTY.

 <svg viewBox="0 0 24 24" stroke="currentColor" …>
-  <rect x="2" y="4" width="20" height="16" rx="3" />            # generic terminal
-  <path d="m6.5 10.5 2.5 2-2.5 2" />
-  <path d="M12.5 14.5h5" />
+  <path transform="translate(9 0) scale(0.625)" d="…spark…" />  # Claude's spark, whole, top-right
+  <rect x="1" y="13.5" width="10" height="9" rx="2.5" />        # terminal badge, bottom-left
+  <path d="m3.625 16 2.25 2-2.25 2M7.125 20h1.25" />             # >_, padded inside the badge
 </svg>
  • Claude: the spark is the same mark Paseo shows for its built-in claude provider, drawn whole, so it reads as Claude without a label.
  • TTY: the >_ terminal badge sets it apart from the built-in provider and says how this one runs Claude.
  • Theme colour: drawn in currentColor, so it follows Light, Dark and Catppuccin like the app's other icons.
  • Badge bottom-left: Paseo draws an agent's status dot over the bottom-right of its tab icon.
  • Within the daemon's checks: SVG only, 1.8 KiB, no <script>, <style>, <foreignObject>, handlers or hrefs.
  • Attribution: the README gains a License and attributions section saying the spark is Anthropic's and the plugin isn't affiliated with Anthropic.

Evidence

Rendered by the Paseo 0.11.2 web UI from an isolated daemon (separate --home) with this branch's plugin installed. Agent tabs, claude-tty next to a built-in claude agent:

Agent tabs before and after in Light, Dark, Catppuccin Latte and Catppuccin Mocha

The tab icon zoomed in. Before this round's fix, the _ touched the badge's right border; now the prompt sits clear of the border on every side:

Zoomed tab icon, prompt before and after padding

The model picker and the composer's model button:

Model picker after

The images live on the assets/claude-tty-icon-screenshots branch, which is not for merging.

Merge Danger

Door: two-way

One SVG and a README section; reverting restores the placeholder.

Blast Radius: legal

The spark is Anthropic's mark, and their trademark guidelines ask for approval before using it. If Anthropic objects, the icon has to change. Clients pick up the icon when the plugin reloads.

Closes #37

sleeyax and others added 2 commits October 12, 2026 13:56
The placeholder was a generic terminal, which said nothing about Claude.
The new icon keeps the terminal frame and prompt chevron and opens its
top-right corner for an eight-spoke asterisk, the ✻ glyph Claude Code
prints in its own terminal UI. It is drawn from scratch rather than
derived from Anthropic's mark, and the frame tells it apart from the
built-in claude provider's spark.

The spark sits top-right because Paseo draws an agent's status dot over
the bottom-right corner of its tab icon.

Closes #37

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
The spark on a terminal still read as a generic terminal with a star in
it. Clawd, the mascot Claude Code prints when it starts, says Claude Code
at a glance and is easy to tell apart from the built-in claude
provider's spark. He is redrawn from the block characters of that banner,
one quadrant per pixel, in Claude's terracotta, which reads on light,
dark and Catppuccin backgrounds alike.

Clawd is Anthropic's, so the README now says so and that the plugin is
not affiliated with Anthropic.

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
@sleeyax sleeyax changed the title feat(claude-tty): draw the provider icon as Claude's spark on a terminal feat(claude-tty): draw the provider icon as Clawd Oct 12, 2026
…minal badge

Clawd in terracotta said Claude Code but nothing about the terminal, and
broke from the theme's colour. The icon is now Claude's spark, the mark
Paseo shows for the built-in claude provider, with a terminal window cut
into its lower-left corner: Claude, running in a TTY. It is drawn in
currentColor again, and the badge stays clear of the status dot Paseo
puts on the bottom-right of a tab icon.

The mask carries a namespaced id because clients inline every provider's
SVG into the same document.

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
@sleeyax sleeyax changed the title feat(claude-tty): draw the provider icon as Clawd feat(claude-tty): draw the provider icon as Claude's spark with a terminal badge Oct 12, 2026
sleeyax and others added 3 commits October 12, 2026 20:58
The badge's cut-out clipped the spark's lower-left rays. The spark is now
a little smaller and sits top-right, clear of the badge, so nothing is
masked and every ray is drawn in full.

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
…rame

The underscore ran into the frame's right border. The prompt is now
shortened and centred, so it sits clear of the border on every side.

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
@sleeyax
sleeyax merged commit c2511c3 into main Oct 12, 2026
1 check passed
@github-actions github-actions Bot mentioned this pull request Oct 12, 2026
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

claude-tty: a proper provider icon

1 participant