Agent Card

A gallery card for one agent: a gradient cover carrying the apps it works with, then its name, a line of description and who made it.

tsx

1import { AgentCard } from "@pestoui/core"

Cover styles

cover="bleed" runs the gradient to the card edges. cover="inset" frames it in the card, with tighter text padding. Each icon is wrapped in a raised Icon Tile for you.

Niche Content Composer

Drafts a daily post for your niche and schedules it to your channels.

byContent team

Inbox Triage Assistant

Sorts incoming mail, drafts replies and flags anything urgent.

bySupport team

Gradients, no author

Four cover gradients. Leave author out and the “by” row is dropped entirely.

Weekly Report Writer

Summarises the week's runs every Monday.

Guest Concierge

Answers booking questions around the clock.

Props

Prop	Type	Default	Description
title	string	—	Required. The agent's name.
description	string	—	Required. One or two lines under the title.
gradient	"sky" \| "sunrise" \| "blossom" \| "meadow"	—	Required. The cover's gradient.
icons	ReactNode[]	—	Required. One raised tile per entry, centred on the cover. Give each a key.
author	string	—	Shown as “by <author>” with an orb. Omit to drop the row.
authorHue	"violet" \| "pink" \| "orange" \| "blue" \| "teal"	"violet"	The hue of the author's orb.
cover	"bleed" \| "inset"	"bleed"	Cover to the card edges, or framed inside the card.
className	string	—	On the card.

PreviousActivity Gauge Next Alert

Pesto UI · 117 documented components