Skip to content
SPECIFICTION
Get listed

Calque

github.com

WindowsmacOSLinuxSelf-hosted
Visit github.com
Spec score 7.8 #12 of 24 in AI Screenshot-to-Code Tools

What it is

Calque is a free, MIT-licensed tool that turns a PNG or JPEG website screenshot into HTML and CSS by measuring pixels. It can produce a self-contained HTML file or JSON measurements, including colors, type scale, weights, spacing, container width, gutters, and corner radii. It also identifies sections, columns, cards, buttons, alignment, and reading order, and can reconstruct vertical gradients. With the assets option, it crops photographs from the screenshot for use in the output. Its check command renders the result in an installed Chrome-family browser and compares it pixel by pixel with the screenshot. Calque is packaged as a Claude skill that provides measurements for Claude to use when writing project code. The documented workflow uses Tesseract for OCR; Docker is optional. The maker says it makes no model call or API request and works offline after OCR data is cached. It handles one screenshot, not a whole site, and cannot identify an exact typeface. Icons become placeholders, and photo crops retain screenshot resolution and any overlaid text.

Spec sheet

Purpose
Calque turns a website screenshot into working HTML and CSS by measuring pixels rather than asking a vision model to interpret them.Read 9 Oct 2026 · github.com
License
The repository is MIT licensed, and its README says users may take, host, fork, and sell it.Read 9 Oct 2026 · github.com
Maker
The repository says Calque is part of Openware, whose GitHub profile describes its work as self-hostable replacements for subscription software.Read 4 Oct 2026 · github.com
Claude integration
Calque ships as a Claude skill that provides measured screenshot details for Claude to use when writing project code.Read 9 Oct 2026 · github.com
Design measurements
It extracts design tokens including colors, type scale, weights, spacing, container width, gutters, and radii.Read 9 Oct 2026 · github.com
Image handling
With the --assets option, it crops photographs from the screenshot and references those crops in the output.Read 9 Oct 2026 · github.com
Inputs and outputs
It reads PNG or JPEG screenshots and can write a self-contained HTML file or a JSON file of measurements.Read 9 Oct 2026 · github.com
Known weak cases
The maker reports lower reconstruction matches for photograph-heavy pages and identifies dark pages with large glows or gradients behind text as its worst case.Read 4 Oct 2026 · github.com
Layout and images
It finds sections, columns, cards, buttons, alignment, and reading order, and can crop photographs from the screenshot as assets.Read 4 Oct 2026 · github.com
Layout features
It identifies sections, columns, cards, buttons, alignment, and reading order, and can reconstruct vertical gradients.Read 9 Oct 2026 · github.com
Limit: icons and photos
Icons become placeholders, while cropped photographs remain screenshot-resolution images with any overlaid text baked in.Read 9 Oct 2026 · github.com
Limit: page coverage
It reads one screenshot and does not capture scrolling, hover states, or another breakpoint.Read 9 Oct 2026 · github.com
Limit: typography
Calque cannot identify a typeface from a screenshot, and font weight resolves to about one step.Read 9 Oct 2026 · github.com
Limits
It processes one screenshot rather than a whole site, cannot identify the exact typeface, and uses cropped screenshot images rather than recovering original photographs.Read 4 Oct 2026 · github.com
Other tools
The documented workflow uses Tesseract for OCR and Docker as an optional way to run Calque in a container.Read 4 Oct 2026 · github.com
Output
It can write a self-contained HTML file or a JSON specification of its measurements.Read 4 Oct 2026 · github.com
Performance and accuracy
The README says processing takes about a second per page and reports fixture match scores ranging from 15.3% to 97.1%.Read 9 Oct 2026 · github.com
Privacy and operation
The maker says Calque makes no model call or API request, and that after its OCR data is cached it works offline; the Docker build preloads that data.Read 4 Oct 2026 · github.com
Quality check
Its check command renders the rebuilt page in an installed Chrome-family browser and compares it with the screenshot pixel by pixel.Read 4 Oct 2026 · github.com
Requirements
The package specifies Node.js 20 or later; the README says the first run downloads about 15 MB of OCR data and caches it.Read 9 Oct 2026 · github.com
Runtime
The maker says Calque runs in about a second per page and its tests run without network access.Read 4 Oct 2026 · github.com
Runtime and network
The maker says the Docker build works offline after building, and that nothing else opens a socket.Read 9 Oct 2026 · github.com
Validation
The check command renders the output in an existing Chrome-family browser and compares it with the screenshot pixel by pixel.Read 9 Oct 2026 · github.com

Strong points and limits

Strong points

  • Outputs self-contained HTML or JSON measurements.
  • Extracts layout details and design tokens.
  • Pixel-by-pixel comparison is available through its check command.
  • No model call or API request, according to the maker.
  • MIT-licensed and available for self-hosting.

Limits

  • Processes one screenshot rather than a whole site.
  • Cannot identify the exact typeface.
  • Icons become placeholders.
  • Photographs are screenshot-resolution crops, not recovered originals.

Who it suits

Calque suits developers who want to turn a single screenshot into a measured HTML/CSS starting point, particularly those working with Claude or offline workflows. It is less suited to recreating full sites or recovering original imagery and typography.

Verdict

Calque offers a direct route from one screenshot to measured markup, with a browser-based visual check and offline operation after OCR data is cached. Its limits around page coverage, typography, icons, and photograph recovery matter when fidelity depends on those details.

Where Specifiction places it

Alternatives to CalqueAll alternatives →