## Photo Adjust (S—305)

Basic photo adjustments: exposure, contrast, grain and vignette sliders, a press-and-hold compare, and one-tap presets.

- URL: https://sundaeui.dev/components/photo-adjust
- Category: 3D & creative · Art direction: Refined
- Access: Sundae Pro (authenticated install)
- Stack: React 18+, TypeScript, plain CSS; dependencies: none
- Install: `npx shadcn@latest add https://sundaeui.dev/r/photo-adjust.json`
- Tags: filters, adjust, editor, image, photo, media

Adjustments are CSS filters on the image plus an SVG grain and a vignette ring, all live. Presets set every slider at once; touching a slider marks the look as Custom.
Hold the Compare button (or the image) to see the original. Reset puts everything back to zero.

### Usage

```tsx
import { PhotoAdjust } from '@/components/sundae/photo-adjust'

<PhotoAdjust />
```

### Props

- `src` (`string`): Image URL; a drawn scene is used if omitted.
- `onChange` (`(v: Adjustments) => void`): Called on change.
- `fill` (`'dark' | 'light'`, default `'dark'`): Surface: dark or light.

### When to use

- Avatar and listing uploads, light editing before posting.

### When not to use

- Professional editing: use a dedicated editor.

### Accessibility

- Each slider is a labelled range with a signed value.
- Compare works with Space held on the button.
- Reduced motion removes the movement and keeps every state change.