image-rendering:pixelated Integer Scale Note
Observed geometric integer magnification check; image-rendering:pixelated can operate at noninteger scales and does not require exact integer zoom. Explicit supplied computed/layout context only; not a browser cascade/layout engine or cross-browser guarantee.
Description
Integer scaling can map one source pixel to a uniform number of display pixels.
Integer scaling can map one source pixel to a uniform number of display pixels.1
A numeric scale check does not control the actual image resampling performed by a browser. Use image-rendering:pixelated Integer Scale Note to evaluate the supplied inputs under the specific model below.
When to use image-rendering:pixelated Integer Scale Note
Use image-rendering:pixelated Integer Scale Note to evaluate the supplied inputs under the specific model below. Define the supplied layout, token or rendering scenario and establish the relevant units and browser context independently.
How to use image-rendering:pixelated Integer Scale Note and understand its results
- Define the supplied layout, token or rendering scenario and establish the relevant units and browser context independently.
- Enter Intrinsic pixel width, Rendered width px using the field table and validation rules below, then run the tool.
- Read Scale factor, Uniform integer pixel scale and interpret units, signs, ordering and placeholders as explained below.
- If the tool reports an input error, correct that field and rerun. A successful false result, empty match list or unknown-evidence placeholder has the specific meaning described here; check the limitations before applying the result.
| Input field | Meaning | Value type | Requirement |
|---|---|---|---|
| intrinsicPixelWidth | Intrinsic pixel width | number | Required; constraints below |
| renderedWidthPx | Rendered width px | number | Required; constraints below |
Enter a positive safe-integer intrinsic width and a positive rendered width in px. Return rendered/intrinsic and whether that ratio is an integer. This is a single-axis geometric check, not a browser sampling-quality measurement; a nonintegral downscale is reported false and no rendering style is applied.
scale = renderedWidth/intrinsicWidth; integerScale = Number.isInteger(scale) Field order, units and branch conditions follow the implementation explanation above.
| Output field | Meaning | Value type |
|---|---|---|
| scaleFactor | Scale factor | number |
| uniformIntegerPixelScale | Uniform integer pixel scale | boolean |
{
"input": {
"intrinsicPixelWidth": 10,
"renderedWidthPx": 25
},
"output": {
"scaleFactor": 2.5,
"uniformIntegerPixelScale": false
}
} Limitations and assumptions
A numeric scale check does not control the actual image resampling performed by a browser. Apply the exact scope and assumptions described above.
All listed fields require explicit values. Unexpected fields, incorrect types, nonfinite numbers and sparse arrays fail validation. Domain-specific bounds, alignments and supported tokens are stated above; extremely large inputs or outputs can also be rejected. These errors differ from successful results such as false, no matches or unknown evidence.
Alternative or Complementary methods
Use font-feature-settings Ligatures Toggle for a related task: Ligature settings request particular OpenType feature tags.
Use font-variant-numeric Tabular/Lining Lookup for a related task: Numeric font features distinguish digit width and digit form.
References
Similar or alternative tools
- font-feature-settings Ligatures Toggle
Ligature settings request particular OpenType feature tags.
- font-variant-numeric Tabular/Lining Lookup
Numeric font features distinguish digit width and digit form.