Web platform features explorer

rect() and xywh()

The rect() CSS function creates a rectangle shape with insets from the edges of an element. The xywh() CSS function creates a rectangle shifted by an x and y distance. They can be used with clip-path and shape-outside.

Status

Baseline Newly Available (since 2024-01-23)

This feature is expected to reach Baseline Widely Available status on: 2026-07-23

MDN documentation

Specifications

Browser support

  • Chrome 119 Released on 2023-10-31
  • Chrome Android 119 Released on 2023-10-31
  • Edge 119 Released on 2023-11-02
  • Firefox 122 Released on 2024-01-23
  • Firefox for Android 122 Released on 2024-01-23
  • Safari 17.2 Released on 2023-12-11
  • Safari on iOS 17.2 Released on 2023-12-11

View as JSON | Edit this feature | Report an issue | Web-features entry: source, dist