border-start-start-radius

Rounds the corner where the 'start' of the block (top) and the 'start' of the inline dimension (left in LTR) meet. This is the logical successor to 'border-top-left-radius'.

Quick example

.modern-box {
  /* Rounds the logical top-left corner */
  border-start-start-radius: 15px;
  padding: 1.5rem;
  border: 2px solid #333;
}

Quick facts

Initial value
0
Inherited
No
Applies to
all elements (UAs not required when collapse)
Animation type
lpc

Values

border-top-left-radius

border-start-start-radius Browser Support

Widely available Since 2021 95% global usage

This feature is well established and works across many devices and browser versions. It has been available across browsers since 2021.

Safe to use without fallbacks.

89+
66+
15+
89+
ESC