componente · v0.2.0+

ToolCard

Card con accent bar 5px superior + icon box 42×42 + title display + tag pill + subtitle + body + meta strip opcional. Color del accent customizable.

Variantes

GitHub Copilot
IDE Plugin
El pionero
Completion + chat dentro del IDE. El más extendido.
100M+ usersVSCode/JB
Claude Code
CLI
CLI agéntico
Terminal-first. Lee y edita el repo entero con criterio. Skills + subagentes nativos.
AnthropicCLI
Cursor
IDE
Fork de VSCode IA-first
Edit múltiples archivos a la vez. Composer + agente.
Aider
CLI
Pair programmer
Open source. Git-first: cada edit es un commit. Bring your own model.
OSSBYOM
uso
<ToolCard
  icon="🤖"
  title="Claude Code"
  subtitle="CLI agéntico"
  tag="CLI"
  accent="#2563eb"
  body="Terminal-first. Lee y edita el repo entero."
  meta={['Anthropic', 'CLI']}
/>

Props

PropTipoDefaultDescripción
iconstring''Emoji/glyph para el icon box.
titlestring''Título display.
subtitlestring''Subtítulo (opcional).
tagstring''Pill mono uppercase a la derecha del título.
accentstringvar(--color-electrico)Color del accent bar superior + borde del icon box.
bodystring''Texto principal (alternativa al slot).
metastring[][]Strip inferior con meta-data en mono.