gradient · sample · Haiku 4.5 · trial 067 of 100

What the model said

Here's a practical CSS gradient example:

```css
/* Linear gradient (left to right) */
background: linear-gradient(to right, #667eea 0%, #764ba2 100%);

/* Linear gradient (top to bottom) */
background: linear-gradient(to bottom, #f093fb 0%, #f5576c 100%);

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

/* Radial gradient */
background: radial-gradient(circle, #667eea 0%, #764ba2 100%);

/* Multiple color stops */
background: linear-gradient(to right, 
  #ff0000 0%, 
  #ffff00 25%, 
  #00ff00 50%, 
  #00ffff 75%, 
  #0000ff 100%
);
```

The basic syntax is:
- **Linear**: `linear-gradient(direction, color1, color2, ...)`
- **Radial**: `radial-gradient(shape, color1, color2, ...)`

You can adjust the direction, add more color stops, or combine multiple gradients for more complex effects.