# Dogfood notice
This site is generated and debugged with vlmkit itself.

# Hero
VLM-assisted UI.
Verified in the browser.
vlmkit connects an AI agent's VLM vision to real-browser measurements, so it can implement UI from screenshots, find breakage, fix it, and prove the result.
Install one skill. The AI picks and runs the right UI workflow.
apm install mizchi/vlmkit
npx skills add mizchi/vlmkit

# Real output
Actual output,
measured.
Reference screenshot
Agent implementation
Measured residual
6/6 components matched
1.40% pixel diff after 4 rounds
A small model rebuilt the page from pixels alone.
It found defects the existing VRT suite missed.
A visual migration reached zero drift.

# Playable demo
NEW IN 0.11
The interaction gates stopped reading markup and started performing the gesture.
Some defects only exist
while you are dragging.
52/52 two seeds played to a win in CI
144 plies, with the DOM audited after each one
57 tests: the rules headless, the view in Chromium
6 interaction families the 0.11 probes drive
vlmkit check integrity
vlmkit check a11y focus
vlmkit check a11y touch --level AAA
Play the demo

# Workflow
Turn visual opinions
into fixable facts.
Measure in a real browser
Return the exact location
Prove it again

# Principle
Vision proposes.
Measurements decide.

# Agent skill
Install once.
Ask naturally.
Meta entry
vlmkit
“Implement this mock.”
mock-markup
“Check responsiveness and interactions.”
dynamic-markup
“Turn this spec into stable tests.”
spec-to-playwright
WHAT THE AI CAN CHOOSE
Everyday verification
markup-assist
UI creation
mock-markup
auto-markup
dynamic-markup
Test generation
spec-to-playwright
Comparison and monitoring
vrt-markup-synth
vrt-visual-diff
vrt-regression-watch
vrt-migration-eval
Evaluation and hardening
vrt-css-fix-loop
agent-validation-loop
Install with APM
curl -sSL https://aka.ms/apm-unix | sh
apm install mizchi/vlmkit
Install with skills CLI
npx skills add mizchi/vlmkit

# Start
Measure the page
you have now.
npm install -D @mizchi/vlmkit
