H1-to-Body Hierarchy Ratio
Measured headingPx to body size ratio, not an accessibility or style prescription.
Description
Calculate H1 heading size divided by body-text size.
A heading-to-body ratio describes one step in a typographic hierarchy. This tool compares the declared H1 size with the body size without selecting a design scale.
When to use this tool
Calculate H1 heading size divided by body-text size. Use it when the input measurements and conventions below match the operation you need.
- Prepare headingPx, bodyPx, respecting the measurement basis and boundaries below.
- Compare the worked example with your intended operation before reusing its result.
How to use the tool and how it works
- Enter every field in the input table using the stated units and exact supported selector spelling where applicable.
- Run the tool. Correct input errors before interpreting an output.
- Read the result fields below; use accompanying flags and the stated sign, boundary or model convention when interpreting a number.
headingPx and bodyPx must be positive. sizeRatio equals headingPx divided by bodyPx.1
| Input field | Meaning and units | Accepted input |
|---|---|---|
| headingPx | Heading px. Pixels. | Finite number; greater than zero |
| bodyPx | Body px. Pixels. | Finite number; greater than zero |
| Output field | Interpretation |
|---|---|
| result | Object containing the following named result fields. |
| result.sizeRatio | Size ratio; use the stated units and sign convention. |
{
"input": {
"headingPx": 12,
"bodyPx": 16
},
"output": {
"result": {
"sizeRatio": 0.75
}
}
}Limitations and assumptions
- The calculation does not inspect heading semantics, perceived emphasis, font metrics or accessible page structure. A size ratio alone does not define a complete hierarchy.
- Every declared field is required and unexpected fields are rejected. Numeric inputs must be finite; input errors are distinct from a valid false result or an explicitly qualified output.
- Extremely large inputs and nonfinite or excessively large outputs are rejected. List positions reported by the tool use zero-based indices unless stated otherwise.
Alternative or Complementary methods
Compare the metric calculation with the intended font and rendered text. Font shaping and layout inspection are more appropriate when the task depends on actual glyph positions or reading conditions. Compare the scope of the nearby tools below before substituting one.
References
Similar or alternative tools
- Caption Size Ratio To Body
Measured captionPx to body size ratio, not an accessibility or style prescription.
- Footnote Size Ratio To Body
Measured footnotePx to body size ratio, not an accessibility or style prescription.