Pre-alpha · First usable release planned for late 2026.

Gramlot Rosetta One idea. Five implementations.

Lesson 06 · First steps

Contact colors

Each contact now has a Title background color picker. Its value and the title bar background subscribe to the same relative Data field, ^.color. Choose a color to update that title bar immediately; every contact keeps its own color.

Example · Vue

Code

How it works · Vue

Each reactive contact starts with a dark color. The color input uses v-model, and the heading’s :style reads that same contact’s color. Vue updates the title background when the value changes, while shared CSS handles the rest of the card.

How it compares

This example shows close semantic parity: Vue binds the picker with v-model and the heading with :style, while Gramlot binds both through ^.color. Gramlot preserves the same relative scope notation, but neither recipe needs an explicit color-change callback. There is no strong simplicity advantage to claim here.