DEVOPS
Responsive breakpoint gate comparing previews against Figma frames
Captures each Vercel preview across mobile, tablet, and desktop widths, overlays them against the matching Figma design frames.
How it runs
The automated pipeline, trigger to output.
- TriggerVercel preview deploy readyVercel
- ActionCapture routes at mobile/tablet/desktopBrowserbase
- ActionPull matching design frames from FigmaFigma
- LogicBranch: any breakpoint over fidelity tolerance?
- ActionCreate Linear bug with overlay imagesLinear
- OutputSet failing GitHub commit statusGitHub
What it does
This workflow checks that a preview matches the design at every breakpoint. It renders each tracked route at mobile, tablet, and desktop widths, pulls the corresponding frames from Figma, and overlays render-versus-design to measure deviation. Breakpoints that drift past tolerance fail the gate and get logged as a tracked bug so the mismatch is not forgotten.
When to use it
Use it when design fidelity matters and responsive bugs slip through because reviewers only check one screen size. It fits design-system-driven teams who keep canonical Figma frames and want implementation held to them automatically.
How it works
- 1A Vercel preview-ready webhook triggers the run.
- 2A headless browser captures each route at the configured breakpoint widths.
- 3Matching design frames are pulled from Figma for each breakpoint.
- 4Renders are overlaid against design frames to compute per-breakpoint deviation.
- 5A branch checks whether any breakpoint exceeds the fidelity tolerance.
- 6If so, a Linear bug is created with the overlay images and a failing GitHub status blocks promotion.
Set it up
What you configure once, before turning it on.
- 1Connect VercelDeploys, runtime logs, analytics.
- 2Connect BrowserbaseHeadless browsers, sessions, replays.
- 3Connect FigmaFiles, frames, comments, assets.
- 4Connect LinearIssues, projects, cycles, triage.
- 5Connect GitHubRepos, issues, pull requests, actions.
- 6Set each agent's modelWe leave models unset so you pick the tier — fast + cheap, or top-quality.
- 7Tune it to your dataEdit the prompts, filters, and field mappings so it matches how your team works.
- 8Test, then turn it onRun once against a sample, confirm the output, then enable the trigger.
More DevOps workflows
Hugging Face Spaces idle-runtime sweep with auto-pause
On a schedule, scans all Hugging Face Spaces for ones running idle past a threshold, pauses them to stop billing, and posts a Slack summary with the estimated monthly savings.
Slack-approved pause for idle Hugging Face Spaces
On a daily scan it finds idle paid Spaces and posts an interactive Slack approval; on approve it pauses the Space and logs the decision to a GitHub issue audit trail.
Generate a weekly de-flake report and assign Linear cleanup tickets
On a weekly schedule, aggregates the current quarantine manifest and recent flake history, builds a prioritized report.
Block costly Hugging Face Space hardware upgrades in PR review
When a pull request changes a Space's hardware config, it estimates the new monthly cost and posts a GitHub PR comment that flags upgrades crossing a budget ceiling.
Auto-release tests from quarantine once they prove stable
Triggered by a webhook from a nightly stability runner, checks whether quarantined tests have passed enough consecutive runs, removes the stable ones from quarantine in GitHub.
Quarantine a test on demand from a PR comment command
Triggered when an engineer comments a quarantine command on a pull request, validates the test name, commits the quarantine change to that PR branch, opens a tracking issue.
Run it inside a business
This workflow drops into a full company template. Import the org, and this is one of the playbooks its agents run.
Run this workflow in your colony.
14-day trial. No DevOps. No Sales call. Provisioned in under a minute.