Solution
To change ant design button border radius in react js, first install ant design library using npm install antd
command import and use button
component from it. Use CSS style attribute and make border-radius 50px
.
Snippet
In this snippet, see the short example to use button
component of ant design library, with the use css style style={{borderRadius:'50px'}}
.
<div>
<Button style={{borderRadius:'50px'}} type="primary">BorderRadius Button</Button>
</div>
Example
In this example, we will import the button
component from the ant library, and with use <div>
element with CSS style style={{borderRadius:'50px'}}
, button component as a primary
type of ant design library.
Let’s start coding…
App.js
import { Button } from 'antd';
function App() {
return (
<div>
<Button style={{borderRadius:'50px'}} type="primary">BorderRadius Button</Button>
</div>
);
}
export default App;
Output
Links
Here, we are provided code sandbox links for the above program change ant design button border radius. Then you can use whenever you went and do the changes as per your requirements.
Happy Coding,
I hope the above example with help you to do your task.