FREEDOM251

Freedom251 › AI Screenshot-to-Code Tools

Calque

Free plan LinuxMacSelf-hostedWindows

Visit Calque Alternatives

Calque's own site

What Calque is

Calque converts a PNG or JPEG screenshot of a website into HTML and CSS by measuring the image’s pixels. It can save the result as a self-contained HTML file or as JSON describing its measurements. Those measurements include colors, type scale, font weights, spacing, container width, gutters, and corner radii. Calque also identifies sections, columns, cards, buttons, alignment, and reading order, and can crop photographs from the screenshot to use as image assets.

Its check command renders a rebuilt page in an installed Chrome-family browser and compares it pixel by pixel with the screenshot. Calque is also packaged as a Claude skill that supplies measurements for Claude to use when writing project code. Its documented workflow uses Tesseract for OCR, and Docker is an optional way to run it in a container. Calque makes no model calls or API requests; after OCR data is cached, it works offline. It supports plain HTML and CSS custom properties, and is available for Linux, macOS, Windows, and self-hosting. The project is MIT-licensed and is part of Openware. Calque handles one screenshot at a time, cannot determine the exact typeface, and uses image crops rather than recovering original photographs.

Who it suits

Calque suits developers who want to rebuild a page from a PNG or JPEG screenshot and work with plain HTML and CSS. It may also suit people using Claude for project code or looking for software they can host, fork, or sell under the MIT license.

What it does well

  • Exports a self-contained HTML file or JSON measurement specification.
  • Measures colors, type scale, spacing, gutters, and corner radii.
  • Identifies sections, columns, cards, buttons, alignment, and reading order.
  • Can crop photographs from screenshots as image assets.
  • Runs offline after OCR data is cached, with no model calls or API requests.
  • Includes a browser rendering check that compares pages pixel by pixel.

What to know first

  • Processes one screenshot at a time.
  • Cannot identify the exact typeface used in a screenshot.
  • Uses cropped screenshot images instead of recovering original photographs.
  • Reconstruction matches are lower for photograph-heavy pages and dark pages with large glows or gradients behind text.

Limits

Calque processes one screenshot at a time and cannot identify the exact typeface. Its image assets are crops from the screenshot rather than the original photographs; matches are lower on photograph-heavy pages and on dark pages with large glows or gradients behind text.

Getting started

  1. Open the Calque GitHub repository.
  2. Choose Linux, macOS, Windows, or a self-hosted setup.
  3. Provide a PNG or JPEG screenshot.
  4. Use the documented Tesseract OCR workflow; Docker is optional.
  5. Choose HTML or JSON output, and use the check command for a browser comparison.

Verdict

Choose Calque if you want pixel measurements from a single website screenshot to guide an HTML and CSS rebuild, with a browser-based visual comparison. Look elsewhere if you need whole-site processing, exact typeface identification, or recovery of the original photographs.

Questions

Is Calque free?

Yes. It is free and described as open-source software.

What license does Calque use?

The repository describes it as MIT-licensed and says it can be hosted, forked, or sold.

Which platforms does it support?

Calque is available for Linux, macOS, Windows, and self-hosting.

What does Calque produce?

It can write a self-contained HTML file or a JSON specification of its measurements. Its supported output uses plain HTML and CSS custom properties.

Does Calque use a model or make API requests?

No. After its OCR data is cached, it works offline.

Who makes Calque?

The repository identifies Calque as part of Openware, whose GitHub profile describes its work as self-hostable replacements for subscription software.

Facts from Calque's own pages

Claude integration
Calque ships as a Claude skill that provides measured screenshot details for Claude to use when writing project code. · github.com, 9 Oct 2026
Design measurements
It extracts design tokens including colors, type scale, weights, spacing, container width, gutters, and radii. · github.com, 9 Oct 2026
Image handling
With the --assets option, it crops photographs from the screenshot and references those crops in the output. · github.com, 9 Oct 2026
Inputs and outputs
It reads PNG or JPEG screenshots and can write a self-contained HTML file or a JSON file of measurements. · github.com, 9 Oct 2026
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. · github.com, 4 Oct 2026
Layout and images
It finds sections, columns, cards, buttons, alignment, and reading order, and can crop photographs from the screenshot as assets. · github.com, 4 Oct 2026
Layout features
It identifies sections, columns, cards, buttons, alignment, and reading order, and can reconstruct vertical gradients. · github.com, 9 Oct 2026
License
The repository is MIT licensed, and its README says users may take, host, fork, and sell it. · github.com, 9 Oct 2026
Limit: icons and photos
Icons become placeholders, while cropped photographs remain screenshot-resolution images with any overlaid text baked in. · github.com, 9 Oct 2026
Limit: page coverage
It reads one screenshot and does not capture scrolling, hover states, or another breakpoint. · github.com, 9 Oct 2026
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. · github.com, 4 Oct 2026
Limit: typography
Calque cannot identify a typeface from a screenshot, and font weight resolves to about one step. · github.com, 9 Oct 2026
Maker
The repository says Calque is part of Openware, whose GitHub profile describes its work as self-hostable replacements for subscription software. · github.com, 4 Oct 2026
Other tools
The documented workflow uses Tesseract for OCR and Docker as an optional way to run Calque in a container. · github.com, 4 Oct 2026
Output
It can write a self-contained HTML file or a JSON specification of its measurements. · github.com, 4 Oct 2026
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%. · github.com, 9 Oct 2026
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. · github.com, 4 Oct 2026
Purpose
Calque turns a website screenshot into working HTML and CSS by measuring pixels rather than asking a vision model to interpret them. · github.com, 9 Oct 2026
Quality check
Its check command renders the rebuilt page in an installed Chrome-family browser and compares it with the screenshot pixel by pixel. · github.com, 4 Oct 2026
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. · github.com, 9 Oct 2026
Runtime
The maker says Calque runs in about a second per page and its tests run without network access. · github.com, 4 Oct 2026
Runtime and network
The maker says the Docker build works offline after building, and that nothing else opens a socket. · github.com, 9 Oct 2026
Validation
The check command renders the output in an existing Chrome-family browser and compares it with the screenshot pixel by pixel. · github.com, 9 Oct 2026

Where Calque stands on Freedom251

Look at these too