Apply CSS filters (grayscale, blur, brightness, contrast, hue-rotate, sepia) with real-time preview and generated code.
Upload an image for preview
Adjust CSS filter sliders
Copy the generated CSS filter code
Free is enough for most one-off jobs. Pro raises the file and batch caps; Pro + Media unlocks GB-scale streaming and unlimited duration.
Larger files supported on Developer (5 GB CSV) and Enterprise (unlimited). All processing happens in your browser — files never reach a server.
0 bytes uploaded. CSS Filter Generator runs entirely in your browser using Canvas API and WASM. Your image stays on your device at all times. No data is sent to any server.
Grayscale, blur, brightness, contrast, hue-rotate, saturate, sepia, invert, and opacity.
Convert color images to grayscale using luminance-weighted conversion. Perfect for printing.
Open toolFine-tune brightness and contrast of any image. Real-time preview with slider controls. Browser-based.
Open toolExtract the dominant colors from any image as HEX, RGB, and HSL values. Perfect for design systems.
Open tool