Color & Effects

Color Model

All colors in Varve are represented as ManagedColor, a discriminated union. The picker exposes six editing views:

• RGB — sRGB color with a shared RGB/HSL/HSB format selector and bit-depth-aware channels (8-bit 0-255, 16-bit 0-65535, or float 0-1)
• CMYK — Cyan, Magenta, Yellow, Key (black) percentages for print production
• Grayscale — Single channel grayscale
• Lab — perceptual lightness and signed a/b channels
• LCH — perceptual lightness, chroma, and hue
• Spot — Named spot color (e.g., Pantone) for specialized print output

RGB uses a prominent saturation/value area, hue and opacity ramps, aligned channel fields, and always-visible HEX and opacity controls. Numeric fields accept signed and decimal drafts, commit on Enter or blur, retain invalid HEX text for correction, and cancel an active draft with Escape. A Gamut Warning is a qualified display hint; soft proof status is shown separately when a registered profile converter is available. Screen sampling follows browser feature detection and the EyeDropper API, so unsupported browsers expose a disabled control with an honest explanation.

Picker workflow

Document Colors, Recent Colors, and the built-in palette sit below the editing controls. Swatches carry their canonical color space, profile, spot identity, and precision; the face is only a display preview. Recent colors are shared across picker instances and deduplicated by canonical identity.

Gradient fills and strokes open the same floating panel. Choose a gradient type, select or add a stop on the bar, edit its color in the shared picker, then expand Gradient options for interpolation space, hue direction, tiling, midpoint, and rotation. Selecting a stop or opening options does not create an undo entry; a drag is committed as one gesture.

Document Color Settings

The Inspector's Document Color section (no selection required) controls the document's color intent:

• Mode — Assign RGB, CMYK, or Grayscale as the working mode. Assignment changes intent only; existing colors keep their values and are converted at export.
• Precision — 8-bit, 16-bit, 16f, or 32f. Sets the storage depth for newly authored colors; existing values are never rewritten.
• Blend space — sRGB or linear-light compositing.

File → Document Color Mode… (also in the command palette) opens the Assign vs Convert dialog: Assign changes the working mode without rewriting values, Convert rewrites every process color in one undoable transaction (analytical in the browser; profile-accurate ICC conversion via the desktop engine).

Color Conversion

Varve includes a full analytical color conversion pipeline (no ICC files needed for basic operations):

• sRGB ↔ Linear RGB ↔ XYZ ↔ CIELAB ↔ Oklab ↔ CMYK
• Perceptual color difference (ΔEOK) for quality assessment
• Gamut mapping via binary-search chroma reduction

For print production, Varve also supports ICC-profile-aware conversion with bundled profiles for common RGB and CMYK standards (sRGB, Adobe RGB, Fogra39, GRACoL, SWOP).

Background Removal

Select an image and choose a user-facing mode: Fast for a local heuristic on simple backgrounds, Auto for the best available general-purpose local model, or High quality for difficult hair, fur, foliage, and thin edges. Auto prefers the optional IS-Net model when installed and otherwise uses bundled U²-NetP. High quality uses downloadable BiRefNet Lite where the available provider and memory budget are safe.

Model downloads require explicit consent, are checksum-verified, and stay on the device. A browser or desktop provider can refuse a model before an unsafe allocation; when that happens, Varve reports the actual model used instead of silently calling the result high quality. Review the mask on the checkerboard, white, and black backgrounds before applying it. The source image stays intact, and the mask can be refined with the brush or trimap tools and undone like any other document edit.

These models estimate foreground alpha. They are not a guarantee of true physical matting for glass, smoke, steam, or other translucent material; use the trimap editor and inspect the result against the final background for those cases.

Fill System

Every shape supports a stack of fills rendered from top to bottom. Each fill has its own opacity and blend mode:

Solid Fill

A single color fill. Select a color from the color picker, then adjust opacity with the alpha slider.

Gradient Fill

Varve supports four gradient types:

• Linear — Color transitions along a line with configurable angle (0-360°)
• Radial — Color transitions outward from a center point
• Angular — Color transitions around a center point (conic gradient)
• Diamond — Color transitions outward in a diamond pattern

Each gradient has a transform matrix for precise positioning (Figma-style gradient handles). Add and remove color stops, adjust their positions, and choose between smooth and stepped interpolation.

Image Fill

Fill a shape with a raster image. Varve's ImageCache handles async loading with LRU eviction (max 200 entries). The fill respects the shape's bounds and can be scaled via the imageFit property (cover, contain, fill).

Image Palette Extraction

Select one image, open the Appearance tab, and expand Palette beside Paint Library. Varve decodes a bounded preview of the source and, when the image is cropped, analyses the visible crop (a Full image choice is available). The calculation is local and deterministic: image pixels are not uploaded and no model download is required.

1. Choose a requested count from 3–12 colours and select Analyze.
2. Review extracted swatches with their coverage and role candidates. Transparent pixels are ignored rather than treated as a colour.
3. Use the HEX copy action, apply an extracted colour as a fill, or save the swatches to the document.
4. Review Derived harmonies and Accessible pairs. Harmony colours are generated suggestions, not colours sampled from the image.

Accessible pairs use the shared WCAG 2.1 contrast calculation: 4.5:1 for body-text AA, 3:1 for large-text AA, and the corresponding AAA thresholds. These checks are a review aid; final contrast still depends on typography, anti-aliasing, display, and export profile.

Save as color tokens creates new document variables without replacing existing variables. Both swatch and variable saves are ordinary document updates and can be undone.

Strokes

Each shape can have multiple strokes, each with independent styling:

• Weight — Stroke thickness in pixels
• Color — Supports all ManagedColor types
• Dash pattern — Array of dash/gap lengths (e.g., [4, 2] for dashed lines)
• Cap style — Butt, Round, or Square
• Join style — Miter, Round, or Bevel
• Miter limit — Maximum miter length before bevel is used

Strokes and layer effects on text follow the actual glyphs rather than the text box. Image fills, raster layers, compound vectors, and warped images follow their rendered alpha, so transparent backgrounds, fill-rule holes, and internal gaps stay transparent. Weight, color, and inside/center/outside alignment are preserved; dash, cap, and join controls apply to vector centerlines, while alpha silhouettes have no single centerline.

Effects

Varve's effects engine supports multiple effects per node, each with independent blend mode and opacity:

• Drop Shadow — Offset shadow with configurable blur, spread, and color. Renders using the canvas shadow API with proper per-effect blend mode isolation.
• Inner Shadow — Shadow inset within the shape bounds. Uses clip + blur technique for accurate rendering.
• Layer Blur — Blurs the entire layer content with configurable radius.
• Background Blur — Blurs the content behind the layer (requires offscreen canvas compositing).
• Outer Glow — No-offset shadow effect that creates a glow around the shape.
• Inner Glow — No-offset shadow inset within the shape.

For the complete Layer Effects workflow, including raster and text coverage, masks, stage-aware ordering, and export boundaries, see the Layer Effects feature guide.

Halftone & Screens

The Halftone adjustment screens scoped artwork into clustered AM dots, lines, rings, or stochastic FM texture while keeping the editable source. Controls cover frequency in lines per inch with a document-space period readout, angle, shape, threshold, intensity, edge softness, ink and paper colors, and an ink-on-transparency alpha mode. Process CMYK screening adds per-ink angles, registration offsets, GCR/UCR black generation, a total ink limit, and single-plate preview — an artistic process-screen simulation, not an ICC separation.

Color Halftone is a separate object filter for comic, zine, and pop-art looks in CMYK, RGB, or mono mode. Screens are anchored in document coordinates, so panning and zooming never shift the pattern or change the ruling. See theHalftone guide for the complete workflow, FM algorithm choices, and export behavior.

Image Treatments

Image Treatments add non-destructive local texture, contrast, atmospheric depth, dehaze, vignette, grain, and highlight glow. Select an image for the curatedImage Tuning controls. For a vector, text, frame, or group, useDesign/Properties → Object Filters; Object Finishing provides direct starting points for Grain, Vignette, and Highlight Glow while retaining the full Object Filter menu for deliberate advanced use.

Treatments preserve the editable source object and can be bypassed or reset without discarding their settings. See the Image Treatments guidefor choosing a treatment and tuning Grain Amount, Grain Size, Grain Roughness, and Pattern Variation.

Blend Modes

Varve supports 18 blend modes, applied per-fill and per-effect:

• Normal — Standard alpha compositing
• Multiply, Screen, Overlay, Darken, Lighten — Standard layer blending
• Color Dodge, Color Burn, Hard Light, Soft Light — Advanced blending
• Difference, Exclusion — Difference-based blending
• Hue, Saturation, Color, Luminosity — Non-separable W3C L*C*h blend modes
• Pass Through — Group blend mode that passes children through unblended
• Plus Darker, Plus Lighter — Additive and subtractive blending

Color Swatches

Document colors are collected from the current scene and Recent Colors are session-backed. The picker applies these canonical colors but does not expose unsupported swatch-library management claims; document variables remain the durable token workflow.

Color Mode Switching

Documents can be switched between RGB, CMYK, and Grayscale color modes. When switching, Varve converts all document colors using analytical conversion math. This is useful for preparing designs for both screen and print output.