HTML CSS examples for CSS Widget:Shape
Curly Circle shape
<html> <head> <meta name="viewport" content="width=device-width, initial-scale=1"> <style id="compiled-css" type="text/css"> body {<!--from w ww. j av a 2 s .c om--> margin:4em; } .burst { background:green; width:81px; height:81px; line-height:81px; font-size:3em; color:Chartreuse; position:relative; text-align:center; border-radius:11px; } .burst::before, .burst::after { content:""; position:absolute; z-index:-2; top:0; left:0; bottom:0; right:0; background:inherit; border-radius:inherit; transform:rotate(28deg); } .burst::after { transform:rotate(-31deg); } </style> </head> <body> <div class="burst"> Lor </div> </body> </html>