gradient · sample · Haiku 4.5 · trial 064 of 100

What the model said

Here's a simple CSS gradient example:

```css
background: linear-gradient(to right, #ff0000, #0000ff);
```

This creates a gradient that transitions from red on the left to blue on the right.

Here are some other useful variations:

**Diagonal gradient:**
```css
background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
```

**Radial gradient:**
```css
background: radial-gradient(circle, #ffffff 0%, #000000 100%);
```

**Multi-color gradient:**
```css
background: linear-gradient(90deg, red 0%, yellow 25%, lime 50%, cyan 75%, blue 100%);
```

**Gradient with angle:**
```css
background: linear-gradient(45deg, #ff6b6b, #4ecdc4, #45b7d1);
```

The basic syntax is:
- `linear-gradient(direction, color1, color2, ...)`
- `radial-gradient(shape, color1, color2, ...)`
- Direction can be: `to right`, `to bottom`, `135deg`, etc.
- You can add percentage stops to control where colors transition

Would you like me to create an HTML file with a live example, or customize a specific gradient?