A propriedade border-radius permite que os desenvolvedores web para projetar com CSS3 cantos arredondados em seus projetos, sem o uso de imagens ou usar vários div's.

O exemplo que você vê na imagem foi feita com o seguinte código:

arquivo style.css

#ejemplo1 {
height: 65px;
width:160px;
background-color:#EEEEEE;
-moz-border-radius-bottomright: 50px 25px;
border-bottom-right-radius: 50px 25px;
}

#ejemplo2 {
height: 65px;
width:160px;
background-color:#FF0000;
-moz-border-radius-bottomright: 25px 50px;
border-bottom-right-radius: 25px 50px;
}

#ejemplo3 {
height: 5em;
width: 12em;
background-color:#0000FF;
-moz-border-radius: 1em 4em 1em 4em;
border-radius: 1em 4em 1em 4em;
}

#ejemplo4 {
height: 65px;
width:160px;
background-color:#F2F2F2;
-moz-border-radius: 25px 10px / 10px 25px;
border-radius: 25px 10px / 10px 25px;
}

sintaxe:

border-*-*-radius: [ | <%> ] [ | <%> ]?