border-gradient-radius
Version:
A React component for creating gradient borders with border radius
46 lines (35 loc) • 1.43 kB
Markdown
A React component for creating gradient borders with customizable border radius.
```bash
npm install border-gradient-radius
yarn add border-gradient-radius
```
```jsx
import { BorderRadiusGradient } from 'border-gradient-radius';
function App() {
return (
<BorderRadiusGradient
gradientValue="linear-gradient(45deg, #f3ec78, #af4261)"
borderRadius="10px"
borderWidth="2px"
className="custom-class"
>
<div style={{ padding: '20px' }}>Your content here</div>
</BorderRadiusGradient>
);
}
```
| Prop | Type | Default | Description |
| ------------------------ | --------------- | --------- | -------------------------------------- |
| containerBackgroundColor | string | "#FFF" | Background color of the container |
| gradientValue | string | "" | CSS gradient value for the border |
| children | React.ReactNode | undefined | Content to render inside the container |
| className | string | "" | Additional CSS classes |
| borderWidth | string | "" | Border width (e.g., "1px", "2px") |
| borderRadius | string | "" | Border radius (e.g., "10px", "50%") |
## License
MIT