Free · No account · Nothing uploaded
Fourteen design tools for your browser.
Fourteen free, fixed-logic utilities for color, type, layout, visual style, and conversion. Each tool runs in the browser on Durga.design. There is no account and no backend. Search or filter by category, then open a tool by URL.
color
Contrast Checker
Check WCAG 2 contrast between text and background.
color
Hex to RGB/HSL Converter
Convert hex colors to RGB and HSL, or reverse them.
color
Color Blindness Simulator
Preview a color or UI screenshot under protanopia, deuteranopia, and tritanopia.
type
Type Scale Generator
Generate a modular type scale from a base size and ratio.
type
Line Height / Letter Spacing Calculator
Turn a font size into line-height and letter-spacing you can paste.
layout
Spacing/Sizing Scale Calculator
Build a spacing scale from a base unit, linear or geometric.
layout
Aspect Ratio Calculator
Solve for width, height, or CSS aspect-ratio from any two values.
layout
CSS Grid Generator
Set columns, rows, and gap, then copy production CSS Grid.
layout
Flexbox Playground
Tune flex-direction, wrap, justify-content, align-items, and gap on a live playground.
style
Border Radius Generator
Link or unlock corners, add Figma-style smoothing, and copy border-radius CSS.
style
Shadow Generator
Build a CSS box-shadow with offset, blur, spread, and color.
style
Gradient Generator
Compose linear or radial CSS gradients with color stops and angle.
convert
Px to Rem/Em Converter
Convert pixels to rem and em against a root or parent size.
convert
SVG to Base64 Converter
Paste or drop an SVG and get a base64 data URI for CSS, HTML, or JSX.
About
What these tools are.
Free browser utilities for product designers and front-end engineers working on fintech and B2B SaaS interfaces.
Check WCAG contrast, convert colour formats, preview colour vision deficiency, build type and spacing scales, solve aspect ratios, and copy CSS for grid, flexbox, radius, shadow and gradients. Everything runs locally in your browser.