srcset x-Descriptor vs sizes w

Classifies a single srcset descriptor using conforming author syntax. Empty descriptor means 1x; width is a positive safe integer and density a positive finite float. Width descriptors use sizes, while density descriptors do not.

Description

Responsive images can describe candidates by intrinsic width in w or pixel density in x.

Responsive images can describe candidates by intrinsic width in w or pixel density in x. Width candidates depend on a source size; density candidates already express that relationship.1

Classifies a single srcset descriptor using conforming author syntax. Empty descriptor means 1x; width is a positive safe integer and density a positive finite float. Width descriptors use sizes, while density descriptors do not.

When to use srcset x-Descriptor vs sizes w

Use this for the following task: Classifies a single srcset descriptor using conforming author syntax. Empty descriptor means 1x; width is a positive safe integer and density a positive finite float. Width descriptors use sizes, while density descriptors do not.

Prepare the parsed attribute values, element states or ordered local lists requested below. Keep attribute presence separate from value.

How to use srcset x-Descriptor vs sizes w and understand its results

  1. Prepare the parsed attribute values, element states or ordered local lists requested below. Keep attribute presence separate from value.
  2. Enter descriptor using the field table, then run the tool.
  3. Read kind, value, usesSizes, valid. Interpret flags, units, ordering and placeholder values using the rules below.
  4. Review any reported issue or failed check, correct the supplied values when appropriate, and verify the result in its intended context.
Input fieldMeaningValue type and boundsRequirement
descriptorDescriptorstring; maximum text length 1000Required

Classify one exact descriptor without surrounding whitespace. Require positive safe-integer widths or positive finite densities using the supported decimal/exponent syntax. Invalid descriptors return kind invalid, value 0 and false flags.2

empty descriptor → 1x; valid w → usesSizes; valid x → no sizes dependency

This summarizes the declared operation. Units, indexing, inclusivity and exceptional cases are explained in the surrounding text.

Output fieldMeaningValue type
kindKindstring
valueValuenumber
usesSizesUses Sizesboolean
validValidboolean
json
{
  "input": {
    "descriptor": "640w"
  },
  "output": {
    "kind": "width",
    "value": 640,
    "usesSizes": true,
    "valid": true
  }
}

Limitations and assumptions

This does not parse a complete srcset, detect duplicate candidates or choose an image for a device.

This evaluates supplied local information; it does not fetch a page or run a browser. Malformed requests produce input errors. A successfully evaluated request can still contain false flags, empty result lists or a result outside the supplied threshold; those outcomes have the meanings stated above.

Alternative or Complementary methods

Choose sizes Attribute Width Formula Lookup for this operation: Resolves the first matching sizes clause from parsed media flags and already-resolved nonnegative CSS pixel lengths. If none matches, source size defaults to viewport width (100vw). Auto sizes and CSS parsing are outside this profile. For a complementary task, use picture/source Art Direction Order for this operation: Chooses the first eligible picture source in document order from supplied media-match and format-support flags. Supply only source elements before the fallback img that have usable source sets. Reports selected element presence without fetching or selecting image candidates.

Further background: HTML / accessibility reference: srcset x-Descriptor vs sizes w.

References

  1. HTML / accessibility reference: srcset x-Descriptor vs sizes w — WHATWG

  2. srcset x-Descriptor vs sizes w — tool.io

Similar or alternative tools

  • sizes Attribute Width Formula Lookup

    Resolves the first matching sizes clause from parsed media flags and already-resolved nonnegative CSS pixel lengths. If none matches, source size defaults to viewport width (100vw). Auto sizes and CSS parsing are outside this profile.

  • picture/source Art Direction Order

    Chooses the first eligible picture source in document order from supplied media-match and format-support flags. Supply only source elements before the fallback img that have usable source sets. Reports selected element presence without fetching or selecting image candidates.

Don't forget to set a bookmark for tool.io!
Privacy | Imprint | Cookies