Baseline grid rhythm API

Snaps line-height up to a whole number of baseline-grid units and returns the snapped leading, line-height, and rhythm-preserving margins. Answers 'How do I align 16px text to an 8px baseline grid?', 'What line-height keeps my vertical rhythm?'.

Price$0.04per request

MethodPOST

Route/v1/design/vertical-rhythm

StatusLive

MIME typeapplication/json

Rate limit120/minute

Cache0s public

designtypographyvertical-rhythmbaseline-gridleadingline-heightgridlayout

API URLhttps://x402.hexl.dev/v1/design/vertical-rhythm

Integration docs

Example request

{
  "baselinePx": 8,
  "fontSizePx": 16,
  "minLineHeight": 1.3
}

Example response

{
  "baselinePx": 8,
  "fontSizePx": 16,
  "minLineHeight": 1.3,
  "baselinesPerLine": 3,
  "snappedLeadingPx": 24,
  "snappedLineHeight": 1.5,
  "recommendedMarginPx": 8,
  "cssLineHeight": 1.5,
  "interpretation": "Line occupies 3 baseline unit(s) of 8px; set bottom margins to multiples of 8px."
}

Input schema

{
  "type": "object",
  "required": [
    "baselinePx",
    "fontSizePx"
  ],
  "properties": {
    "baselinePx": {
      "type": "number",
      "description": "Baseline grid unit in px",
      "examples": [
        8
      ]
    },
    "fontSizePx": {
      "type": "number",
      "description": "Font size in px",
      "examples": [
        16
      ]
    },
    "minLineHeight": {
      "type": "number",
      "description": "Minimum acceptable line-height before snapping (default 1.3)",
      "examples": [
        1.3
      ]
    }
  }
}

Output schema

{
  "type": "object",
  "additionalProperties": true
}