Három érték a különböző sarkok lekerekítéséhez CSS-ben

Ha három érték van megadva, akkor az első érték a bal felső sarok lekerekítését határozza meg, a második - egyidejűleg a jobb felső és a bal alsó sarokéét, a harmadik pedig a jobb alsó sarokéét:

html<div id="elem"></div>

css#elem {
  width: 300px;
  height: 100px;
  border: 1px solid red;
  border-radius: 10px 20px 30px;
}

Результат: