Gradient Rainbow
Rainbow Text
<span style="background:linear-gradient(90deg,#ff0000,#ff7f00,#ffff00,#00ff00,#0000ff,#9400d3);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;font-weight:bold;font-size:2em">Rainbow Text</span>Customize
#ff0000
#9400d3
Props
| Name | Type | Default | Description |
|---|---|---|---|
text | text | Rainbow Text | Displayed text |
fontSize | slider (em) | 2em | Text size |
fontSizeUnit | select | em | Font size unit |
color1 | color | #ff0000 | Gradient start color |
color2 | color | #9400d3 | Gradient end color |
Rainbow gradient text effect