Image Adjustments

Color grading: upload, fit and seven filter sliders. Pro · Image generation › Results and editing

Installation

npx valyro-cli@latest login
npx valyro-cli@latest add image-adjustments

npm install valyro-ui-pro

import 'valyro-ui-pro/styles.css';
import { ImageAdjustments } from 'valyro-ui-pro';

Prop	Type	Default
`value`	`Adjustments`		Slider positions (controlled).
`defaultValue`	`Adjustments`		Initial `value` when uncontrolled.
`onValueChange`	`(value: Adjustments) => void`		Called with the new `value` when it changes.
`image`	`string`		Image URL (controlled); an upload replaces it with an object URL.
`defaultImage`	`string`		Initial `image` when uncontrolled.
`onImageChange`	`(image: string, file?: File) => void`		Called with the new `image` when it changes.
`fit`	`'cover' \| 'contain' \| 'fill'`		How the image fills the preview (controlled).
`defaultFit`	`'cover' \| 'contain' \| 'fill'`		Initial `fit` when uncontrolled.
`onFitChange`	`(fit: ImageFit) => void`		Called with the new `fit` when it changes.
`accept`	`string`	`'image/*'`	File types the picker accepts. Default `image/*`.
`labels`	`Partial<ImageAdjustmentsLabels>`		Overrides for the built-in English text; keys left out keep their defaults.

Generation Progress — Steps, ETA, live latent preview, queue
Image Result Grid — Result gallery with actions and a lightbox
Image Compare — Before/after comparison: slider, side by side, overlay
Inpaint Canvas — Inpainting mask and canvas outpainting
Generation History — Generation history by day, with filters
Prompt Editor — Prompt and negative prompt: weights, LoRA, autocomplete, token count
Generation Settings — Model, sampler, steps, CFG, size, presets
Aspect Ratio Picker — Aspect ratio and exact size
Seed Input — Seed: random, fixed, increment
LoRA Stack — LoRA stack: strengths, toggles, order, trigger words
Style Presets — Style cards with previews and weights
Reference Image Input — Reference image for img2img and ControlNet