Skip to contents

Each of the four characters has a distinct personality, five moods and a set of colour palettes. Tessa and Sela are stable; Knurl and Neer are experimental and may change.

A short animation: in one small app, Tessa is happy when the settings are saved, Sela thinks while the analysis runs, the app switches to dark mode, Knurl is worried about a file and Neer celebrates when the report is ready. Each one shows its status text beside it, and the matching update_mascot() call is shown below.

The four characters take turns in the same app, in light and dark mode. Each status line sits beside the character, and the code below shows the update_mascot() call behind each change.

Here is what a busy afternoon looks like when all four work together.

The Bridge at Five, a 50-second film with no sound. Every character in it is a real mascot(), drawn live by the package and filmed on a small stage. The status lines you see under them are each character’s own lines.

Read the transcript

A short story with Tessa, Sela, Knurl and Neer. About 50 seconds, no sound. This transcript is the text alternative to the film: it says who speaks, what each mascot’s status line reads, and what happens on screen.

The words in speech bubbles are the characters’ own lines for this story. The status lines under each mascot come straight from the package: each one is the line that character shows for its current mood.


0:00 to 0:03. Title. The Bridge at Five. A short story with Tessa, Sela, Knurl and Neer. The sky is going peach and lilac over a quiet stream.

0:03. Dusk by the stream. A little wooden bridge arches over the water. It is nearly finished, but there’s a gap in the middle where one plank is still missing. On the left bank, next to a small stack of spare planks, stands Tessa. On the right bank, Sela stands by her timetable board. The clock on the board reads 4:50.

The camera drifts in towards Tessa. She looks at the gap and has a think.

  • Tessa, status line: Working out how the parts fit.
  • Tessa: One plank to go.

0:10. Across the water. The camera glides over to Sela, who gives a small, satisfied nod.

  • Sela, status line: Schedule is balanced and clear.
  • Sela: Opening at five. Plenty of time.

0:12. Knurl arrives. Far away along the bank path, a single-wheeled repair robot comes into view, small and a little hazy at first, then larger as it rolls towards us. It is carrying the last plank in its clamp.

  • Knurl, status line: Diagnosing task
  • Knurl: Plank incoming.

Knurl rolls up onto the bridge and stops beside the gap.

0:18. The mishap. Knurl lowers the plank into the gap. It won’t sit flat: it wobbles, tips, slips, and drops into the stream with a splash. The picture gives a little shake.

  • Knurl, status line: Queue error
  • Knurl: Plank lost.
  • Sela, status line: Direct schedule clash detected. (The clock on her board turns red: 4:52.)
  • Sela: Eight minutes to five!
  • Tessa, status line: One part needs a closer look.
  • Tessa: Where did it go?

The plank bobs away downstream, towards us.

0:26. Neer. Ripples spread across the water, and Neer rises out of the stream, right beside the floating plank: a calm water elemental with a little shell on her head. At first she simply watches.

  • Neer, status line: Nothing has changed., then Checking the inputs.

She has spotted what went wrong: the plank has two pegs on one side, and they were pointing up.

  • Neer: Pegs up. Turn it over.
  • Neer, status line: The form is valid.
  • Sela, status line: Reviewing resource conflict.

0:32. The fix. Neer lifts the plank on a spout of water, all the way up to the bridge. Knurl catches it in its clamp and turns it over, pegs down. It drops into the gap and clicks into place with a little shower of sparkles.

  • Knurl, status line: Task repaired
  • Knurl: Flipped. Fitted.
  • Tessa, status line: That came together nicely.
  • Tessa: Thank you, Neer!
  • Sela, status line: Conflict resolved cleanly.

0:38. Five o’clock. Knurl rolls back across to the bank. The camera pulls back, the clock on the timetable board reaches 5:00, and the lanterns along the bridge light up one by one. Stars come out, and so do a few fireflies. Everyone celebrates, and everyone waves.

  • Sela, status line: All bookings confirmed and locked.
  • Neer, status line: All checks passed.
  • Knurl, status line: All jobs finished
  • Tessa, status line: Finished, and built to last.
  • Sela: Five o’clock. Right on time.
  • Neer: The lights changed.

Tessa walks out onto the bridge and stands on the new plank to try it.

  • Tessa: It holds!

0:47. End card. Meet your mascots. Tessa, Sela, Knurl and Neer stand in a row, still celebrating. Drawn live, in code, by the mascot package. Five moods each, and a status line for every mood.

Tessa

Tessa is the quiet maker of the group, and the friend who steps forward if you place a mascot without naming one. She belongs to the Hexonians, a family of characters built on a hexagonal frame who share a couple of friendly moves like waving and nodding. Her name comes from tessellation. Hexagons tile a plane without gaps, the way packages fit together cleanly.

Tessa is innocent and always eager to learn. Calm, hard-working, curious and patient, she picks the right tool with care, then takes the next step. Where Neer notices what shifted, Tessa builds. You can recognise her by her slim teal hexagon body and the silver ring that shimmers now and then. Look also for hair with a side fringe, a small bow, small studs, hanging arms, and a chest badge whose icon shows her mood.

Her status lines sound like someone humming along at a sturdy workbench. At rest, she is “Resting, ready for the next piece.” Start a run, and she is “Working out how the parts fit.” If a detail needs fixing, she notes that “One part needs a closer look.” When things go well, she smiles and says “That came together nicely” or “Finished, and built to last.” That steady, step-by-step nature suits tutorials, exploratory tools, teaching guides, and package documentation.

Here is Tessa across her five moods:

Resting, ready for the next piece.
Working out how the parts fit.
That came together nicely.
One part needs a closer look.
Finished, and built to last.

Tessa wears her own night teal colours by default, but she also comes in nine other appearances. Here is her full wardrobe:

Sela

Sela is the organiser of the crew. When appointments overlap, bookings pile up or rosters shift, she stays calm and keeps plans in order. Like Tessa, she is one of the Hexonians, with the same hexagonal silhouette, but she moves to a different rhythm.

She is a lilac hexagon with deep violet hair, flanked by time blocks that sit apart when things are calm, overlap during a clash, and slide apart again once sorted. Her name is a soft echo of “cell”, one hexagon in a grid, and of “selah”, the pause at the end of a line. She hears a clash coming and takes a breath before fixing it.

Her status lines stay just as composed. When everything lines up, she announces that “Schedule is balanced and clear.” If two bookings collide, she notes that “Direct schedule clash detected.” She takes time “Reviewing resource conflict,” and once cleared, confirms that “Conflict resolved cleanly” or “All bookings confirmed and locked.” Sela suits appointment managers, booking calendars, and resource schedules.

Here is Sela across her five moods:

Schedule is balanced and clear.
Reviewing resource conflict.
Conflict resolved cleanly.
Direct schedule clash detected.
All bookings confirmed and locked.

Sela arrives in her own lilac violet, but she also comes in twelve other appearances. Here is every appearance in her collection:

Knurl

Some tasks need a diagnostic scan, a clamp and a steadfast hand, not conversation. Knurl is for those. It is a repair robot from the Visorfolk, a character family whose faces are functional screens. Deliberate, steadfast and mechanically minded, it keeps to two or three words at a time.

Knurl is a single-wheeled workshop bot with a clamp arm and a screen visor. Its name is a nod to a knurl, the ridged grip pattern cut into metal handles and knobs, which suits a repair bot that grips tricky problems.

Where the others speak in complete sentences, Knurl keeps to clipped readouts. When waiting, it shows “Queue idle.” Snags bring up “Diagnosing task.” A broken run triggers “Queue error,” while a fix brings a brisk “Task repaired.” Once clear, it reports “All jobs finished.” Knurl suits background queues, batch jobs, pipeline monitors, and diagnostic views.

Here is Knurl running through its five moods:

Queue idle
Diagnosing task
Task repaired
Queue error
All jobs finished

Knurl appears in its original colours, but it can also take on four other appearances. Here is the full set:

Neer

Neer is the water in the group. She belongs to the Elementals family, characters drawn as living elements. Her name means “water” in Sanskrit and Hindi, as well as in Tamil and other South Indian languages. Like water, she takes on the colours of whatever holds her.

She is drawn in blue water tones with a shell, and she is calm, observant, clear and welcoming. When something changes on screen, she notices what shifted and says so in a few words. If something looks amiss, her worry shows as attention, never panic.

Her status lines are quiet and clear. When nothing has moved, she shows “Nothing has changed.” As you type, she is “Checking the inputs.” Valid entries give “The form is valid.” When values need checking, she flags that “Some fields need attention,” and once everything passes, confirms that “All checks passed.” Neer suits form checks, data entry reviews, and quality control screens.

Here is Neer displaying her five moods:

Nothing has changed.
Checking the inputs.
The form is valid.
Some fields need attention.
All checks passed.

Neer starts in her original blue water tones, but she can also flow into five other appearances. Here is how she looks in each one:

Pick a companion

Pick the one whose voice suits your page: Tessa for tutorials and documentation, Sela for schedules, Knurl for queues and batch jobs, Neer for form checks.