free
33 things this site does without an install
Everything else here describes a browser extension. These run in the tab you already have open: no account, no upload, and no request to anywhere. Each one is computed by the same function that wrote the worked example into the page, so it answers before the script even arrives - and each says at the bottom what the panel does that a page cannot.
tools on this page
33
that need an account
0
that send anything anywhere
0
Add
LoupeKit
- opens the list of browsers it can be installed in
Colour
contrast, conversion and the ramps in between 7- Contrast checker What is the contrast ratio between these two colours?
- Make a colour pass How dark does this brand colour have to be to pass 4.5:1?
- Hex, rgb and hsl What is this hex in rgb, and in hsl?
- Flatten a translucent colour What hex is this colour at 12% over white?
- Tint and shade ramp How do I get a 50-to-900 scale out of one brand colour?
- CSS gradient builder What is the CSS for a gradient between these two colours?
- Colour blindness check Do these two colours still read apart to a colour-blind reader?
Sizing and CSS
the numbers a stylesheet is written out of 10- px to rem, and clamp() What is this px value in rem, and what clamp() gives me that curve?
- Modular type scale What sizes should the headings be if the body is 16px?
- Line height What unitless line-height is 28px on 18px text?
- Letter spacing What is -20 tracking from the design file in CSS?
- Aspect ratio What height keeps this width at 16:9?
- Grid columns What grid-template-columns gives me columns that wrap on their own?
- Box shadow builder What are the box-shadow values for a soft elevation?
- Border radius What is the border-radius for these four corners?
- cubic-bezier, sampled What does this cubic-bezier actually do in the middle?
- Selector specificity Which of these two selectors wins?
Text and payloads
the transforms people paste secrets into a stranger's server to run 8- Encode and decode Where can I decode this without pasting it into a website?
- Decode a JWT What is inside this token, without pasting it into a website?
- JSON to TypeScript What is the TypeScript interface for this JSON response?
- HTML entities How do I escape this so the browser prints it instead of parsing it?
- URL and query string What are the parameters on this URL?
- Slugify a title What is the URL slug for this heading?
- Case converter What is this name in camelCase, kebab-case and SCREAMING_SNAKE?
- Word and character count How many characters is this, and will it fit in a meta description?
Numbers and time
bytes, bases, timestamps, durations 4The wire
headers, types and the tags a link preview needs 4
Add
LoupeKit
- opens the list of browsers it can be installed in
seventy more in the panel, on any page you open