Skip to main content
InstantTools
Color, CSS & dev utilities

Forge

Tools for builders.

Forge is the after-hours studio: black walls, mint glow, the hum of a soldering iron. Color scales, gradients, CSS unit conversion, a regex tester, and decoders for the formats developers paste all day. For people who build for the web and want fewer browser tabs.

01 · Signature experiences

Color, in your control.

4 tools
02 · Ready to use

Utilities from the forge corner.

10 live
Utility

JWT Decoder

Decode and inspect JSON Web Tokens entirely within your browser.

Open Tool →
Utility

JSON Formatter

Beautify, minify, and validate JSON data instantly.

Open Tool →
Files

Base64 Converter

Encode to and decode from Base64 string format.

Open Tool →
Text

URL Encoder

Encode text for use inside a URL, or decode a percent-encoded string back to readable text. Spaces, &, =, /, ?, #, and non-English characters become %XX codes that are safe to put in a query string.

Open Tool →
Utility

CSV to JSON Converter

Convert raw CSV data into formatted JSON arrays instantly.

Open Tool →
Utility

QR Code Generator

Generate static QR codes for URLs, plain text, WiFi credentials, vCards, and email — exportable as PNG or SVG with custom colors and logo overlay.

Open Tool →
Utility

HEX ↔ RGB Converter

Convert between HEX, RGB, RGBA, HSL, HSLA, and OKLCH color formats with a live swatch, alpha slider, and CSS-ready output.

Open Tool →
Utility

SVG Optimizer

Clean up and minify SVG files for web use.

Open Tool →
Files

HTML Minifier

Minify HTML to strip whitespace, comments, and redundant attributes — shrinking page weight without touching markup semantics.

Open Tool →
Files

CSS Minifier

Minify CSS by stripping whitespace, comments, redundant units, and duplicate declarations while preserving every styling rule.

Open Tool →
03 · What it’s for

What Forge is for.

Color, CSS & dev utilities

Forge is for front-end and web work. The four main tools cover the handoff from design to code: turn one brand color into a full scale, build a gradient, convert pixel values to rem, and test a regular expression before it goes into your code. The utilities further down handle the formats you paste around all day: JWTs, JSON, Base64, URLs, CSV, QR codes, SVG, HTML, and CSS.

Everything in Forge runs in your browser. Regex patterns and sample text stay in the page. Tokens you paste into the JWT decoder are decoded locally, and the decoder does not verify signatures, so a token that decodes cleanly is not proof it is genuine. The color and gradient tools write their main settings into the page address, so a link reopens the same palette or starting gradient.

Which tool to open

  • Color Palette Generator Pick it when you have one brand color and need a full set: 11 shades from 50 to 950, five harmony palettes, and CSS custom properties.
  • CSS Gradient Generator Pick it to build a linear or radial background with as many color stops as you need, then copy the finished rule.
  • PX to REM & Color Converter Pick it to turn a pixel spec into rem, em, pt, or % against any root size, or to switch a color between HEX, RGB, and HSL.
  • Regex Tester Pick it to test a JavaScript regular expression on real text and see every match, every capture group, and the replacement result.
04 · Questions

Questions people ask.

4 answers

Is the color scale the same as Tailwind’s?

It uses the same step names, 50 to 950, so it drops straight into a Tailwind theme. The colors are not Tailwind’s. Each step sets a fixed lightness at your color’s hue, from 97% at 50 down to 8% at 950, so your exact hex is usually not one of the swatches. Pick the closest step as your brand step.

Should I use px or rem in CSS?

Use rem for font sizes and most spacing. It scales with the reader’s browser font-size setting, and px ignores that setting. Keep px for things that shouldn’t scale, like 1px borders. At the default 16px root, 24px is 1.5rem.

Which regex flavor does the tester use?

JavaScript, through your browser’s own RegExp engine, so patterns behave the way they will in JavaScript, TypeScript, or Node. Features from PCRE, Python, or .NET, such as possessive quantifiers and atomic groups, either throw an error or mean something else.

Does the JWT decoder check the signature?

No. It decodes the header and payload so you can read the claims and the expiry time. Anyone can build a token that decodes cleanly. Verify the signature on your server with the signing key before you trust a token.

Other collections
Keep exploring.
All seven →