CSS Design Calc

CSS and layout maths for agents: unit conversion, fluid clamp(), type scales, aspect ratios, grids, specificity and readability.

payments ON MAINNET (real money) · 12 live endpoints

EndpointPriceWhat it answers
GET /aspect-ratio$0.02Aspect ratio of a width and height (simplified, nearest common ratio) or the missing side for a ratio, with CSS values.
GET /box-size$0.02CSS box model sizes: content, padding, border and margin boxes from a width and height under content-box or border-box.
GET /clamp-fluid$0.02Generate a CSS clamp() that scales a size linearly between a min and max viewport width, in rem, with the exact slope.
GET /css-specificity$0.02CSS selector specificity (ids, classes, types) per Selectors Level 4, including :is(), :not(), :where() and :has(); compare two.
GET /css-unit-convert$0.02Convert a CSS length between px, rem, em, pt, pc, in, cm, mm, Q, vw, vh, vmin, vmax and % with your root and viewport sizes.
GET /golden-ratio$0.02Split a length into major and minor parts by the golden ratio (or silver, root-2, custom) with matching rectangle sizes.
GET /grid-columns$0.02Column and span widths for an N-column grid from container width, columns and gutter, or the container for a column width.
GET /line-length$0.02Estimate characters per line from column width and font size and rate it for readability (45-75 ideal, WCAG max 80).
GET /pixel-density$0.02Screen pixel density (PPI) from resolution and diagonal, physical size, CSS viewport at a device pixel ratio, and image widths.
GET /target-size$0.02Check a click or touch target against WCAG 2.2 target size (24 px AA, 44 px AAA) including the spacing exception.
GET /type-scale$0.02Modular type scale: sizes in px and rem for steps below and above a base size, by named ratio (major third, golden) or number.
GET /vertical-rhythm$0.02Snap line-heights for font sizes to a baseline grid: baseline unit, lines per element, unitless line-height and margins.

GET /catalog returns this list as JSON. Activity hub · uptime.


Results are computed locally from published formulas and the CSS and WCAG specifications, provided as is, with no warranty. Rendering depends on browsers, fonts and user settings; accessibility checks cover the stated criteria only and are not a conformance audit. Every paid response carries a disclaimer field.