Bots

Animated characters with real physical motion: squash, stretch, impact and secondary motion, on the native Web Animations API. Play with one, then watch it react to an AI agent.

Stage

Gestures

Jumps

Movement

Gel

Change shape

Under the floor

Shape

Skin

View

Silhouette hides the face, color and effects, so you judge the motion by its shape alone.

StateIntensity: 1 Follow the pointer Touch and drag

In an AI chat

A simulated agent (no model is called) sends the same steps a real one would. The bot answers each one with a gesture.

Assistant

Send a message and watch the assistant react.

Message received
Thinking
Using a tool
Waiting
Writing
Done

The code behind what you see

It changes as you pick a shape, a skin and a gesture.

<gf-bot [shape]="shape" skin="g1" [gestures]="gestures" [onAgentEvent]="reacciones" [interactive]="true" />

  protected readonly shape = catShape;
  protected readonly gestures = { frontFlip };
  protected readonly reacciones = agentReactions();

bot.api?.agent('thinking'); // 'thinking' → 'tool' → 'writing' → 'done'

Include AI mode

What it costs

Measured by the bundle check in CI, in KB gzip. You only pay for what you import.

Engine: 49.2 KB
Engine and one shape: 57 KB
With the <gf-bot> component: 65.1 KB
Each gesture you add: +1.7 KB

Icons and bots are independent: installing one never loads the other.