Skip to content

Home page redesign: templates, harnesses, instances + /build page - #479

Draft
sebbycorp wants to merge 7 commits into
mainfrom
kagent-redesign
Draft

Home page redesign: templates, harnesses, instances + /build page#479
sebbycorp wants to merge 7 commits into
mainfrom
kagent-redesign

Conversation

@sebbycorp

@sebbycorp sebbycorp commented Sep 4, 2026 •
edited
Loading

Copy link
Copy Markdown
Collaborator

What this does

Redesigns the kagent.dev home page using the Solo.io design system and updates the story for the new object model. An agent is now an AgentTemplate (model, prompt, tools, skills) running on a Harness (runtime + worker pool). Opening a chat creates an AgentInstance, which runs as a Substrate actor on one of the harness workers. The old Agent CRD is gone, so the site no longer tells people to write one.

Home page

  • Hero with a schematic of the model: template + harness → agent → instances on a worker pool
  • Short explainer section for AgentTemplate / Harness / AgentInstance
  • Agent Substrate section with three animated panels: suspend/resume timings per instance, pod-per-agent vs worker pool density, and sandbox egress policy
  • Build walkthrough with sticky editor panel: Harness → AgentTemplate → MCP servers → ModelConfigs → skills. All manifests are kagent.dev/v1alpha3, pulled from a live cluster
  • Features grid, adopters, community CTA

/build page

Declarative-build landing page: install terminal, the same walkthrough, a "whole loop" terminal and pipeline cards. Not in the navbar yet, URL only.

Implementation

  • Tailwind utilities only, no custom CSS classes
  • Design tokens are --kg-* CSS vars in globals.css (light on :root, dark on .dark) exposed as kg-* colours in the Tailwind config. Fonts: Figtree, DM Sans, DM Mono. Old rd-* CSS removed
  • Shared "blueprint" primitives (dot grid, corner handles, frames, chips, hairline grid) in src/components/home/blueprint.tsx
  • Terminal/editor panels use --kg-term* tokens so they work in both themes. Default theme is dark
  • Footer rebuilt, navbar untouched so it still matches docs
  • Brand assets in public/images/brand/

Heads up

  • Docs still describe the old Agent resource. Nothing under docs-site/content/kagent mentions AgentTemplate or Harness yet, and the walkthrough links point at those pages. Needs a docs pass before this goes live.
  • ModelConfig provider list follows the v1alpha3 enum. Bedrock is provider: Bedrock with bedrock.region. xAI isn't in the enum so it was removed.

Testing

  • tsc + eslint clean
  • Home and /build in dark and light
  • Hero schematic at 1280 and 1040 (hidden below lg)
  • Walkthrough steps + manifest panel
  • CRD fields checked with kubectl explain against a running cluster
  • Cloudflare preview
  • Docs update for templates/harnesses

sebbycorp and others added 7 commits September 3, 2026 20:13
@sebbycorp @claude
Redesign home page and add /build page from Solo.io design system
7e1a06f 
Rebuilds the marketing home page from the "kagent Home v4" artboard and adds a
/build page from the "kagent Build" artboard, using Tailwind utilities on top of
a small set of design tokens (kg-* colours, Figtree / DM Sans / DM Mono).

- Home: centered hero, Agent Substrate section (resume, density, isolation
  panels), scroll-driven Build walkthrough with a manifest panel, pipeline
  cards, features grid, adopters, community CTA
- /build: declarative-build hero with install terminal, the same walkthrough,
  "whole loop" terminal and numbered pipeline
- Tokens in globals.css (:root light, .dark dark) exposed via tailwind.config.ts;
  legacy rd-* custom CSS removed
- Compact footer per the design; navbar left unchanged to match kagent.dev
- Default theme set to dark (design is dark-first)
- Brand assets added under public/images/brand

Co-Authored-By: Claude Fable 5.1 <noreply@anthropic.com>
Signed-off-by: Sebastian Maniak <sebastian@maniak.io>
@sebbycorp @claude
Make terminal and editor panels follow the page theme
e9a2094 
In light mode the manifest editor and terminals stayed near-black while
the YAML colours switched to their light-theme values, leaving the text
almost invisible. The kg-term tokens now flip per theme (white pane, dark
text in light mode) and the hard-coded white/black borders, status bar
and green success colour use tokens instead.

Co-Authored-By: Claude Fable 5.1 <noreply@anthropic.com>
Signed-off-by: Sebastian Maniak <sebastian@maniak.io>
@sebbycorp @claude
Add blueprint-style schematics to the home page
0a1ea96 
Borrow the dot-grid / corner-handle / dashed-chip language for the
home page, as reusable Tailwind-only primitives in blueprint.tsx:

- Hero: dot-grid ground fading down, and a wiring schematic above the
  headline (kubectl apply, skills, MCP servers, A2A feeding an "agents"
  frame).
- Substrate: a "pod per agent vs agent substrate" panel showing the
  same agents with pod overhead paid once instead of per agent.
- Pipeline and features: hairline grids with node dots at every
  intersection, one Lucide icon per feature.

Dot colour is a theme token (--kg-dot) so the grid reads in both
light and dark mode.

Co-Authored-By: Claude Fable 5.1 <noreply@anthropic.com>
Signed-off-by: Sebastian Maniak <sebastian@maniak.io>
@sebbycorp @claude
Remove the 'What happens after you apply' section from the home page
51c591e 
Co-Authored-By: Claude Fable 5.1 <noreply@anthropic.com>
Signed-off-by: Sebastian Maniak <sebastian@maniak.io>
@sebbycorp @claude
Make frame labels transparent and dark-on-light
c67a102 
The label used to mask the top border with a page-colour box, which
showed as a lavender block over the hero gradient in light mode. Draw
the top border as two runs either side of the label instead, so it
needs no background, and use the primary text colour in light mode.

Co-Authored-By: Claude Fable 5.1 <noreply@anthropic.com>
Signed-off-by: Sebastian Maniak <sebastian@maniak.io>
@sebbycorp @claude
Redraw the substrate panels as blueprint schematics
7ef31b0 
Replace the three terminal-style substrate panels with diagrams in the
same dot-grid / corner-handle language as the hero:

- Suspend & resume: a worker pool of nine agents that suspend and
  resume live, each showing its resume time in ms, with a "last
  resume" readout.
- Density: pod per agent against an Agent Substrate worker pool, with
  the pool deliberately oversubscribed and a 30x agents-per-pod
  readout. Heading is now "30x with Agent Substrate".
- Isolation: the agent inside its sandbox, with egress decided per
  destination.

Chip gains a muted state for idle units. The standalone architecture
panel under the substrate intro is folded into the density panel.

Co-Authored-By: Claude Fable 5.1 <noreply@anthropic.com>
Signed-off-by: Sebastian Maniak <sebastian@maniak.io>
@sebbycorp @claude
Restructure the home page around templates, harnesses and instances
6dfa6e1 
kagent has moved from a single Agent resource to AgentTemplate (what an
agent can do) plus Harness (how it runs); the agent is derived from the
two and every conversation is an AgentInstance scheduled as a Substrate
actor onto a harness worker. Bring the site in line:

- Hero: the schematic is now the object model — AgentTemplate and
  Harness feed a derived Agent, which fans out to AgentInstances on a
  worker pool. Subtitle rewritten to match.
- New "model" section: hairline grid explaining AgentTemplate,
  Harness and AgentInstance, ahead of the Substrate panels.
- Substrate panels and copy speak in instances and actors.
- Build walkthrough re-sequenced to Harness -> AgentTemplate -> MCP
  servers -> models -> skills, with v1alpha3 manifests taken from a
  running cluster (kubectl explain / kubectl get). Bedrock provider and
  field names corrected; xAI removed as it is not in the provider enum.
- Features and /build copy updated; runtimes now name the kagent
  runtime, Claude, Codex and BYO harnesses.

Co-Authored-By: Claude Fable 5.1 <noreply@anthropic.com>
Signed-off-by: Sebastian Maniak <sebastian@maniak.io>
@sebbycorp sebbycorp changed the title Redesign home page and add /build page Redesign home page around templates, harnesses and instances; add /build page Sep 5, 2026
@sebbycorp sebbycorp changed the title Redesign home page around templates, harnesses and instances; add /build page Home page redesign: templates, harnesses, instances + /build page Sep 6, 2026
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Reviewers

No reviews

Assignees

No one assigned

Labels

None yet

Projects

None yet

Milestone

No milestone

Development

Successfully merging this pull request may close these issues.

1 participant

@sebbycorp