Web & CSS Calculators Free Developer Tools

Animation Timing Calculator

Generate CSS cubic-bezier timing functions from control points or preset easing curves.

Calculate and simplify aspect ratios from width and height, or scale dimensions to a target ratio.

Generate CSS border-radius with individual corner control, live preview, and shorthand output.

Generate CSS box-shadow values with a live preview and one-click copy.

Check WCAG 2.1 color contrast ratios between foreground and background hex colors.

Generate CSS clamp() values for fluid typography and spacing between two viewport widths.

Generate linear and radial CSS gradient declarations with a live preview.

Calculate CSS Grid column widths and generate grid-template-columns CSS from container width, columns, and gap.

Calculate the specificity of any CSS selector and see the (a, b, c) breakdown.

Convert between em and px CSS units based on any parent font size.

Calculate item widths for flexbox layouts given container width, number of items, and gap size.

Estimate image file size from dimensions, color depth, and format with compression ratios for JPEG, PNG, WebP, and more.

Calculate new image dimensions while maintaining aspect ratio when resizing by width, height, or percentage.

Convert CSS line height between px, em, and unitless ratio, and generate ready-to-use CSS.

Generate CSS media query syntax from width, height, and orientation constraints.

Estimate web page load times across different connection speeds from page size in KB or MB.

Convert between pixel (px) and rem CSS units based on any root font size.

Generate a modular type scale with CSS custom properties from a base size and ratio.

Convert between px, vw, vh, vmin, and vmax CSS viewport units for any screen size.