DevTools

Everyday developer utilities that run entirely on-device

Overview

DevTools is a toolbox of everyday developer utilities — format some JSON, decode a JWT, hash a secret, test a regular expression, convert a color — all in one place. A left rail lists the tools grouped by kind; picking one renders it into the panel on the right. It is part of the kimtos new-tab app suite.

Everything is fully on-device. Each tool is a pure transform built from plain browser APIs (JSON, TextEncoder, the Web Crypto API, crypto.randomUUID, and the like). There is no backend, no account, and no network call — the point is that you can decode a token or hash a secret without pasting sensitive data into some random website. The tools are stateless: nothing you type is saved, so there is no history and no stored data to manage.

The tools

The utilities are grouped into six categories:

Category	Tool	What it does
Format	JSON	Pretty-print, minify, or validate a JSON string.
Encode / Decode	Base64	Encode text to Base64 or decode it back (Unicode-safe).
Encode / Decode	URL	Encode a full URL, encode a single query component, or decode either.
Encode / Decode	HTML entities	Escape text for HTML, or unescape entities back to characters.
Encode / Decode	JWT decoder	Decode a JSON Web Token's header and payload (no signature check), with issued / not-before / expiry timestamps.
Generate	Hash (SHA)	Compute SHA-1, SHA-256, SHA-384, and SHA-512 hashes of your text.
Generate	UUID	Generate one or more random RFC-4122 v4 UUIDs.
Generate	Lorem ipsum	Generate placeholder paragraphs.
Convert	Case convert	Convert between camelCase, PascalCase, snake_case, kebab-case, CONSTANT_CASE, Title Case, Sentence case, and dot.case.
Convert	Color	Convert a color between HEX, RGB, and HSL, with a color picker.
Convert	Timestamp	Convert between Unix timestamps (seconds or milliseconds) and human dates.
Convert	Number base	Convert an integer between decimal, hexadecimal, binary, and octal.
Inspect	Regex tester	Test a regular expression against sample text, with matches highlighted and a match count.
Inspect	Text diff	Compare two blocks of text line by line, with additions and deletions marked.

Privacy model

DevTools stores nothing. Every tool is a one-shot transform: text goes in, a result comes out, and neither is written to disk or sent anywhere.

• No storage — there is no history, no settings, and no records in the suite's shared database.
• No network — hashing uses the Web Crypto API, UUIDs use crypto.randomUUID, and every other tool is plain in-browser string work.
• No signature or key handling — the JWT decoder only reads the header and payload; it never verifies signatures, because there is no secret on-device.

Because the tools are stateless, there is nothing to back up and nothing to delete — closing the app leaves no trace.

Getting Started

Open DevTools from the dock. The left rail lists every tool, grouped by kind (Format, Encode / Decode, Generate, Convert, Inspect). Click a tool to load it into the panel on the right; the first tool (JSON) is selected by default. Nothing you type is stored — each tool just transforms your input on the spot.

The two panel shapes

Most tools follow one of two layouts:

• Input → Output tools (JSON, Base64, URL, HTML entities, JWT decoder) give you an input box, one or more action buttons, and a read-only output box. Type or paste your text, press a button (e.g. Format, Encode, Decode), and the result appears. If the input is invalid, the error is shown inline in the output box.
• Live tools (Hash, Case convert, Color, Number base, Regex tester, Text diff) update as you type — no button to press. Results appear in labelled rows or a preview area.

A copy button sits next to every result, so you can grab the output with one click.

A few examples

• Format some JSON. Open JSON, paste a compact object into the input, and press Format to pretty-print it (or Minify to collapse it). If the JSON is malformed, the parse error tells you where.
• Decode a JWT. Open JWT decoder, paste a token, and press Decode. You get the header and payload as formatted JSON, plus human-readable notes for the iat, nbf, and exp claims — including whether the token has expired. No signature is checked and nothing leaves your machine.
• Hash a secret. Open Hash (SHA) and start typing; the SHA-1, SHA-256, SHA-384, and SHA-512 digests compute live, on-device, via the Web Crypto API.
• Generate UUIDs. Open UUID, set a count (1–100), and press Generate for that many random v4 UUIDs, one per line.
• Convert a color. Open Color and type a #hex, rgb(…), or hsl(…) value — or use the swatch picker — to see all three representations at once.
• Test a regex. Open Regex tester, enter a pattern and flags, and paste sample text; matches are highlighted as you type, with a running match count.

Everything runs locally

DevTools never contacts a server. Hashing and UUID generation use built-in browser crypto, and every other tool is plain in-browser string manipulation. That is the whole point: you can decode a token, hash a credential, or pretty-print internal JSON without handing it to a website. Because nothing is stored, closing the app clears everything — there is no history to revisit and nothing to clean up.

Architecture

DevTools is deliberately simple: a set of pure transforms with a thin UI on top. The transforms have no side effects, touch no storage, and make no network calls — which is what lets the exact same functions power both the on-screen tools and the agent tools. The code lives in extension/src/apps/devtools/.

Modules

File	Role
lib.ts	The pure transforms — formatJson / minifyJson, encodeBase64 / decodeBase64, encodeUri / encodeUrl / decodeUrl, encodeHtml / decodeHtml, decodeJwt, hashText, uuidV4, toCase, parseColor, epochToDate / dateToEpoch, convertBase, and lorem. Each throws an Error with a friendly message on bad input.
index.ts	The app descriptor and UI — the tool registry and left-rail grouping, the shared Input → Output panel, the live tools (hash, case, color, timestamp, number base, regex, diff), and the agent tools array.
meta.ts	The app manifest (id, name, accent, order, marketing copy) consumed by the dock, App Store, and this docs build.
devtools.css	Styling for the sidebar, tool panels, rows, and match highlighting.

The transforms-and-tools split

The interesting property is that lib.ts is the single source of truth, used two ways:

• The UI wires each transform to a panel — buttons for the Input → Output tools, live input listeners for the rest — and renders errors inline.
• The agent tools wrap the same transforms so the HomeAI assistant can call them on-device. Each is guarded so it returns { ok, result, summary } instead of throwing.

Because both paths call the identical functions, the tools and the UI can never drift apart.

Agent tools

DevTools exposes a subset of its transforms to the HomeAI agent as MCP-shaped tools (per the suite convention). They are all pure and stateless, so there is no list/get/CRUD surface — just transforms:

Tool	Wraps
format_json	formatJson — pretty-print / validate JSON.
decode_jwt	decodeJwt — header + payload, no signature check.
base64_encode / base64_decode	encodeBase64 / decodeBase64.
hash_text	hashText — SHA-1 / SHA-256 / SHA-384 / SHA-512 (defaults to SHA-256).
uuid	uuidV4 — one or more random v4 UUIDs.
convert_case	toCase — camel, pascal, snake, kebab, constant, title, sentence, or dot.
convert_color	parseColor — hex / rgb / hsl to all three formats.

The remaining UI-only tools (URL and HTML entity coding, lorem ipsum, timestamp and number-base conversion, the regex tester, and the text diff) are interactive by nature and are not exposed as agent tools.

No persistence

There is nothing to persist. DevTools writes no records, blobs, or key/value entries to the suite's shared database, keeps no settings, and holds no in-memory history — every tool starts blank each time you open it. This is why the app carries no privacy surface beyond the transforms themselves: the data only ever lives in the input and output fields on screen.