THE CREATIVE WORKSPACEIdeas, arranged
Ideas, arranged
with precision.
Eight design calculators for grids, color contrast, typography and image sizing.
DESIGN
IN DETAIL ✳
IN DETAIL ✳
Color Contrast Ratio / SAMPLE ENTRIES
Contrast ratio9.5:1
Normal text 4.5:1Meets ratio
Large text 3:1Meets ratio
Change these inputs →01 / NO ACCOUNTS02 / LOCAL CALCULATIONS03 / METHODS INCLUDED
Design studio
Give your ideas a framework.
Digital design & creative tools / 8 focused tools
OUTING
01
Color Contrast RatioCalculate WCAG contrast from normalized relative luminance values.01
Color
OUTING
02
Responsive Grid ColumnsFind column width after gutters.02
Layout
OUTING
03
Image Aspect ResizeKeep aspect ratio when changing image width.03
Images
OUTING
04
Print Resolution PlannerTranslate pixel dimensions to print size.04
Images
OUTING
05
Type Scale StepsGenerate a small modular typography scale.05
Typography
OUTING
06
Pixels to RemConvert pixel values to CSS rem units.06
Typography
OUTING
07
Canvas Safe AreaCalculate the inside dimensions after uniform margins.07
Layout
OUTING
08
Card Layout FitFind how many fixed-width cards fit in a row.08
Layout
Useful numbers, without the mystery.
Change the examples, review each method and check the limits before acting.
Read our approach →Sophia Reynolds / Independent site contact