Gradient Duotone Buttons
text-sm
<GradientDuotoneButton color="purple2blue" textSize="text-sm">purple2blue</GradientDuotoneButton>
<GradientDuotoneButton color="cyan2blue" textSize="text-sm">cyan2blue</GradientDuotoneButton>
<GradientDuotoneButton color="green2blue" textSize="text-sm">green2blue</GradientDuotoneButton>
<GradientDuotoneButton color="purple2pink" textSize="text-sm">purple2pink</GradientDuotoneButton>
<GradientDuotoneButton color="pink2orange" textSize="text-sm">pink2orange</GradientDuotoneButton>
<GradientDuotoneButton color="teal2lime" textSize="text-sm">teal2lime</GradientDuotoneButton>
<GradientDuotoneButton color="red2yellow" textSize="text-sm">red2yellow</GradientDuotoneButton>text-xs
<GradientDuotoneButton color="purple2blue" textSize="text-xs">purple2blue</GradientDuotoneButton>
<GradientDuotoneButton color="cyan2blue" textSize="text-xs">cyan2blue</GradientDuotoneButton>
<GradientDuotoneButton color="green2blue" textSize="text-xs">green2blue</GradientDuotoneButton>
<GradientDuotoneButton color="purple2pink" textSize="text-xs">purple2pink</GradientDuotoneButton>
<GradientDuotoneButton color="pink2orange" textSize="text-xs">pink2orange</GradientDuotoneButton>
<GradientDuotoneButton color="teal2lime" textSize="text-xs">teal2lime</GradientDuotoneButton>
<GradientDuotoneButton color="red2yellow" textSize="text-xs">red2yellow</GradientDuotoneButton>text-base
<GradientDuotoneButton color="purple2blue" textSize="text-base">purple2blue</GradientDuotoneButton>
<GradientDuotoneButton color="cyan2blue" textSize="text-base">cyan2blue</GradientDuotoneButton>
<GradientDuotoneButton color="green2blue" textSize="text-base">green2blue</GradientDuotoneButton>
<GradientDuotoneButton color="purple2pink" textSize="text-base">purple2pink</GradientDuotoneButton>
<GradientDuotoneButton color="pink2orange" textSize="text-base">pink2orange</GradientDuotoneButton>
<GradientDuotoneButton color="teal2lime" textSize="text-base">teal2lime</GradientDuotoneButton>
<GradientDuotoneButton color="red2yellow" textSize="text-base">red2yellow</GradientDuotoneButton>Props
The component has the following props, type, and default values. See type-list page for type information.
| Name | Type | Default |
|---|---|---|
| textSize | Textsize | 'text-sm' |
| color | Gradientduotones | 'purple2blue' |
| type | ButtonType | 'button' |