Chroma Subsampling
Chroma Subsampling (Color Resolution Reduction)
Chroma subsampling reduces the color resolution of an image while preserving full brightness (luminance) detail. Human eyes are less sensitive to color changes than brightness changes, making this an efficient compression technique.
Technical Detail
Expressed as ratios like 4:4:4 (no subsampling), 4:2:2 (half horizontal color resolution), and 4:2:0 (quarter color resolution). JPEG typically uses 4:2:0, reducing file size by 50% compared to 4:4:4.
Example
```javascript
// Image compression via Canvas
canvas.toBlob(
blob => console.log(`Size: ${(blob.size/1024).toFixed(0)} KB`),
'image/jpeg',
0.8 // quality: 0.0 (smallest) to 1.0 (best)
);
// WebP output (25-34% smaller than JPEG)
canvas.toBlob(cb, 'image/webp', 0.8);
```
Related Formats
Related Tools
C
Compress Image
R
Resize Image
C
Crop Image
R
Rotate Image
F
Flip Image
C
Convert Image
W
Watermark Image
S
SVG to PNG
I
Image to Base64
R
Round Corners
A
Add Border
I
Image Filters
A
Adjust Image
B
Blur Image
S
Sharpen Image
M
Make Square
G
Grayscale Image
S
Sepia Image
P
Pixelate Image
S
Strip Image Metadata
Related Terms
Alpha Channel
Alpha Compositing
Aspect Ratio
AVIF
Batch Resize
Bit Depth
Canvas
Chroma Key
Chromatic Aberration
Color Grading (Image)
Color Profile
Color Space
Compression Artifact
Content-Aware Fill
Convolution
Crop
Dithering (Image)
DPI
DPI/PPI
EXIF
Feature Matching
Focus Stacking
Gamma
Gamut Mapping
HDR
Histogram
ICC Profile
Image Histogram
Image Interpolation
Image Optimization
Image Pyramid
Image Registration
Image Segmentation
IPTC
Lossless Compression
Lossy Compression
Metadata
Mipmap
Morphological Operations
Noise Reduction (Image)
Object Detection
Panorama Stitching
Raster Graphics
Rasterization
Resize
Resolution
Sprite Sheet
Texture Atlas
Thumbnail
Tone Mapping
Vector Graphics
Vignetting
WebP
XMP