border-bottom-left-radius
Specifically rounds the bottom-left corner of an element. This is useful for creating unique shapes like speech bubbles or tabbed interfaces where only certain corners should be rounded.
Quick example
.speech-bubble {
border-bottom-left-radius: 0;
border-top-left-radius: 20px;
border-top-right-radius: 20px;
border-bottom-right-radius: 20px;
} Quick facts
Initial value
0Inherited
No
Applies to
all elements (UAs not required when collapse)
Animation type
lpc
Values
length-percentage border-bottom-left-radius Browser Support
Widely available Since 2015 96% global usage
This feature is well established and works across many devices and browser versions. It has been available across browsers since 2015.
Safe to use without fallbacks.
4+
4+
5+
12+