Status tags

About this plugin

Status tags is a productivity-focused Figma and FigJam plugin designed to provide clear, visual status indicators directly on your design canvas. It allows designers and teams to label frames, components, and sections with specific workflow states (e.g., "In Progress," "Ready for Dev," "Changes needed") that remain visible and legible even at high zoom levels.

The Problem it Solves

In complex Figma files with dozens of frames and pages, it can be difficult for collaborators to know which parts of a design are final, which are still being worked on, and which require review.

1. Context Loss: Traditional methods (like naming frames or using external documentation) require users to click into layers or leave Figma to understand progress.
2. Visibility Issues: Small text labels often disappear when zooming out to see the "big picture."
3. Manual Maintenance: Manually creating and styling status badges is repetitive and inconsistent across a team.

Status Flow automates this by injecting "smart" badges that scale according to the size of the target content, ensuring status visibility across the entire design system.

Key Features

1. Smart Status Badges

1. Automatic Scaling: Badges intelligently resize (Small, Medium, Large) based on the width of the selected core node, ensuring they are always legible.
2. Dynamic Positioning: Badges automatically pin to the top-right of frames or float above instances and groups, staying out of the way of the actual design content.
3. Visual Polish: Each badge features a clean, modern aesthetic with a status dot, high-contrast typography, and subtle shadows to make them "pop" against any background.

2. Fully Customisable Workflow

1. Manage Statuses: Users can create their own custom statuses with specific labels and colours beyond the defaults (Done, In Progress, Review, Changes, Backlog).
2. Custom Colour Palette: A built-in colour picker allows users to assign specific brand colours or standard "traffic light" colours to their statuses.
3. Reorder-able Lists: Drag-and-drop functionality in the settings view lets you organise your status list to match your team's specific workflow sequence.

3. Bulk Management & Cleanup

1. Apply to Selection: Quickly add a status to multiple selected frames or sections at once.
2. Precise Removal: Remove statuses from specific selected items without affecting the rest of the page.
3. Canvas Deep-Clean: A "Remove all from page" feature instantly clears all status annotations, making it easy to hand off a "clean" file to developers or stakeholders.

4. Seamless Integration

1. Cross-Editor Support: Works perfectly in both Figma (design files) and FigJam (white boarding).
2. Persistence: Your custom status list is saved to your Figma account, so your personalised workflow follows you across different files.
3. Dark Mode UI: A premium, dark-themed interface that feels like a native part of the Figma Pro environment.