iziwerk — the brand & site
A name, an identity, a website. One coherent product story.
No longer actively developed. Kept here as a portfolio record of the design, engineering and decisions behind the build.
My own product needed a face before it needed anything else. On 7 July 2026 it went from a brand reference and a locked copy deck to a live nine-page marketing site in one day, held to the same bar as the client work on this site.
// the idea
The idea
A coffee-table idea sharpened fast into a clear one: a calm home for freelancers to run every client — proposals, chat, files, invoices — where they keep 100% and the platform never touches a cent. A three-tier ladder, honest and simple. First it needed a name and a face.
// the brand reference
Six directions on the table. One shipped.
The brand reference held six directions for the same name, each with its own type, colour, motion and headline. The first is the one that became the site.
-
1a Terminal, warmed shipped -
1b Studio paper -
1c Izi pop -
1d Calm system -
1e Ink & riso -
1f Kinetic mono-brutalist
// the identity
Terminal, warmed
I chose a direction — “Terminal, warmed”: a warm-dark canvas (#16130f), a signature amber (#efab5f), Space Grotesk and JetBrains Mono, and a cursor-bar mark — type “iz” and a blinking block finishes the word: iz + ▮ = izi. Systematic and a little playful, but credible enough to pass a payment-underwriter's cold read — the product handles money-adjacent documents, so trust is the whole game.
01 The wordmark
iziwerkon dark
iziwerkon light
iziwerkon amber
iziwerkmono, reversed
Space Grotesk 600 · −0.03em · always lowercase. The cursor is #efab5f on dark and deepens to #c8721f on light, for contrast. The monogram drops the third letter and lets the cursor stand in for it.
02 The palette, by role
- #16130fpage
- #211c16panels
- #2b2418insets
- #342b20rules
- #f2ede3text, wordmark
- #a29a8fquiet text
- #efab5fcursor, calls to act
- #8fc79a100%, paid
- #e8765athe ×
The quiet text started as #8f8578. On it was lifted to #a29a8f, so it clears 4.5:1 on every surface it sits on.
03 Type
Spend your effort on projects.
Space Grotesk 400500600700
// one place · every client · start to finish
JetBrains Mono 400500700
Display, body and wordmark in Space Grotesk; labels, meta and the terminal in JetBrains Mono. Motion follows the direction’s own rule: typed reveals, a slow amber cursor blink, nothing bounces.
// the direction, applied
From a terminal to the page
- Terminal
- warmed
- typeset
- shipped
The homepage’s own hero copy: first as plain text in a cold terminal, then in the brand’s palette, then in its type. The last frame is the real page, captured from the site’s files on 2 Oct 2026; the frames before it are drawn here in the brand’s own colours and fonts.
// the build
The build
Plain HTML/CSS/vanilla JS — no framework, no build step, zero dependencies. Self-hosted fonts, so it makes no third-party runtime calls; a first load under 50 requests; mobile-first at 375px; motion built on transform and opacity with full reduced-motion support and zero layout shift. SEO from the stack, not a plugin — per-page title, meta, canonical, Open Graph and JSON-LD, a real sitemap and robots, one H1 per page.
After launch it grew to carry a two-sided story — a hiring marketplace written up alongside the freelancer pitch — and was hardened with a strict Content-Security-Policy (the one inline bootstrap allow-listed by hash) and HSTS. Still zero-dependency, still self-hosted, throughout.
// the site, on a phone
Four screens, as a visitor meets them
Captured at 390 pixels wide from the site’s own files, 2 Oct 2026.
Home 
The problem, as a pile 
Security 
Pricing
// integrity
Content integrity, on principle
No fabricated testimonials, no fake social proof — reviews sit in an honest empty state until real ones exist. The same rule every site here holds, including this one.
// outcome
Shipped
Live on day one, on Cloudflare Pages then and Cloudflare Workers since, with SSL, a canonical host and a verified Search Console property. Nine pages on launch day; 13 in its sitemap by the end of July. See it at iziwerk.com.