Annotation Layers Rail
A document page mockup where marks from each reviewer form a colored layer, beside a rail of reviewers with color keys, counts, and visibility toggles.
A document page mockup where marks from each reviewer form a colored layer, beside a rail of reviewers with color keys, counts, and visibility toggles.
Search blocks by description or jump to a page.
The source for every Application block is included with Basic and Pro. Pick a plan to copy the code.
Already purchased? Log in
Annotation Layers Rail pairs a document page mockup with a per reviewer layer control: on Brand guidelines page 3 of 18, the highlighted lines carry a colored tint drawn from each reviewer, and a side rail lists Maya Chen, Jordan Lee, Noah Park, and Priya Nair with a color dot, avatar, mark count, and last mark time. Noah Park is toggled off, so his rail row goes muted and his marks clear from the page in sync, showing exactly what a hidden layer does.
The layers are one typed array keyed by id, and the page lines look up their layer to decide whether to render the tinted mark or a plain rule. Hide all and Show all layers handle the bulk toggles. The footer note states the honest rule: each reviewer writes to their own layer, and hiding one only changes your view while the marks stay in place for everyone else.
Reach for this block on any surface where several reviewers mark the same document, wired to your annotation store and a per user visibility preference. Bind each toggle to the layer it controls and Hide all to the view level setting.
A natural flow around it on an Application Pro page:
Before
After
One strong use is the brand guidelines review above. Other layered annotation shapes:
Tip: the muted rail row and cleared page moving together on the hidden layer is what makes the toggle read as a real control rather than a decorative switch.