Free Mobile Web Design Tools
Small, free tools for making websites that read well on phones. Each one runs entirely in your browser — no sign-up, nothing uploaded.
Color contrast checkerCheck text and background colors against WCAG AA and AAA, for light and dark mode, and get the nearest passing color.Tap target size checkerTest a button or link size against WCAG 2.2, Apple and Material guidelines, and get CSS that enlarges the tap area.Mobile font size calculatorConvert px to rem and generate fluid clamp() font sizes, with a preview at real phone and tablet widths.CSS media query generatorMedia queries for the phones and tablets you pick, and breakpoints suggested from 51 real device widths.Device mockup generatorPut a screenshot into an iPhone, Android or tablet frame and download a PNG. Your image never leaves your browser.
Test a whole page
Free mobile-friendly testSee your page on 51 iPhones, Android phones and tablets, with every readability problem highlighted and explained.
Mobile viewport sizesCSS viewport, pixel ratio and resolution for 51 devices — the numbers your media queries see.
Guides behind the tools
- Low-contrast text — find and fix text people cannot read in sunlight.
- Tap targets — buttons and links big enough for a finger.
- Text too small — font sizes that work on a phone.
- The viewport meta tag — the one line every mobile page needs.