JSFiddle - React, Tailwind, and code Playground

HTML

<div></div>

CSS

div{
width: 0px;
height: 0px;
border: 100px solid red;
border-radius: 0px;
}

JavaScript

Read this:

First step, change the value of border 100px to 90px and Run, 80px and Run, 70px and Run like this do upto 0px.

Second step,applying border: 100px; Change the value of border-radius: 0px  to 10px and Run, 20px and Run like this do upto 100px.


You'll see the border-radius value is changing smaller than border-size value, so it is not disappearing but it is producing a circle of remaining border.