Backgrounds
Add custom backgrounds behind your screenshots for a polished, professional look. Perfect for social media, presentations, or marketing materials.Available backgrounds
DomShot provides several gradient presets:| Background | ID | CSS Value |
|---|---|---|
| Sunset | sunset | Orange to coral gradient |
| Ocean | ocean | Blue to purple gradient |
| Forest | forest | Dark green to light green gradient |
| Purple Haze | purple-haze | Purple to deep violet gradient |
| Midnight | midnight | Dark multi-tone gradient |
| Candy | candy | Pink to rose gradient |
| Skyline | skyline | Blue to white gradient |
| Autumn | autumn | Orange to magenta gradient |
| Ocean Blue | ocean-blue | Solid blue |
| Vibrant Red | vibrant-red | Solid red |
| Forest Green | forest-green | Solid green |
| Sunset Orange | sunset-orange | Solid orange |
| Royal Purple | royal-purple | Solid purple |
| Hot Pink | hot-pink | Solid pink |
| Indigo | indigo | Solid indigo |
| Teal | teal | Solid teal |
Basic background
bash
Custom padding and border radius
bash
With mobile viewport
bash
How it works
When you specify abackground, DomShot:
- Captures the screenshot at your specified viewport
- Creates a canvas with the background color/gradient
- Places your screenshot in the center with specified padding
- Applies border radius and shadow effects
- Returns the composite image
Parameters
| Parameter | Type | Default | Description |
|---|---|---|---|
background | string | - | Background ID from table above or custom backgrounds |
backgroundPadding | number | 5% of min viewport dimension | Padding around screenshot in pixels |
backgroundBorderRadius | number | 16 | Corner radius in pixels |
Finding background IDs
Preset background IDs are listed in the table above. For custom backgrounds:- Go to Dashboard Backgrounds
- Click on your background to view details
- Copy the background ID
See also
- Viewport Presets - Device sizes and dimensions
- Image Formats - PNG, JPEG, WebP options