Design-Tools
Colors, gradients, typography, layout previewers, and palette utilities for designers and frontend developers.
Color Picker
Pick colors and get hex, RGB, and HSL values
CSS Gradient Generator
Create beautiful CSS gradients with live preview and code generation
Color Contrast Checker
Check WCAG color contrast compliance for accessibility
Favicon Generator
Favicon Generator
OG Image Generator
OG Image Generator
Logo Placeholder Generator
Logo Placeholder Generator
Color Palette Extractor
Color Palette Extractor
SVG Optimizer
SVG Optimizer
Image to Base64
Image to Base64
Accessibility Checker
Check HTML for common WCAG accessibility issues with actionable fix suggestions
Aspect Ratio Calculator
Calculate and convert aspect ratios for images, video, and responsive design
Color Blindness Simulator
Simulate how colors appear to people with different types of color blindness
Figma Token Converter
Convert Figma design tokens JSON to CSS custom properties, SCSS variables, Tailwind config, or Style Dictionary format
Pixel Art Editor
Grid-based pixel art editor with paint, erase, fill tools and PNG/CSS/JSON export
Color Palette from Image
Extract dominant color palettes from any image as hex, CSS variables, Tailwind config, or JSON
CSS Specificity Calculator
Score and compare CSS selector specificity tuples with a visual cascade breakdown
Cubic Bezier Visualizer
Design CSS cubic-bezier() easing curves with draggable handles and live animation preview