1/* Set rounded corners with border-radius property */
2
3.class {
4  border-radius: 4px;
5}
6
7.circle {
8  border-radius: 50%;
9}

1/* Radius is set for all 4 sides */
2border-radius: 10px;
3
4/* top-left-and-bottom-right | top-right-and-bottom-left */
5border-radius: 10px 5%;
6
7/* top-left | top-right-and-bottom-left | bottom-right */
8border-radius: 2px 4px 2px;
9
10/* top-left | top-right | bottom-right | bottom-left */
11border-radius: 1px 0 3px 4px;
12
13/* The syntax of the second radius allows one to four values */
14/* first radius / radius */
15border-radius: 10px / 20px;
16/* first radius => corner point to left or right side*/
17/* second radius => corner point to top or bottom side*/
18/* radius => corner point to both sides*/

1div {
2  outline: auto;
3  outline-style: round;
4}

1/*A box-shadow can be used for a similar effect*/
2
3.your-box-or-button-class{
4box-shadow: 0 0 3px #000000;
5}

1/*need perfix until now 4/23/2021*/
2
3/*
4-webkit- => Chrome, Safari, New Opera Version
5-moz- => Firefox
6-ms- => Ie, Edge
7-o- => Old Version of Opera
8*/
9
10/* One value */
11-moz-outline-radius: 25px;
12
13/* Two values */
14-moz-outline-radius: 25px 1em;
15
16/* Three values */
17-moz-outline-radius: 25px 1em 12%;
18
19/* Four values */
20-moz-outline-radius: 25px 1em 12% 4mm;
21
22/* Global values */
23-moz-outline-radius: inherit;
24-moz-outline-radius: initial;
25-moz-outline-radius: unset;
26

1/* use box-shadow instead of outline radius */
2box-sizing: border-box;
3border-radius: 100%;
4border: 3px solid #dadada;
5box-shadow: 0 0 0 2px #fff inset;