Design system

Website 2.0 design tokens

Zoho-language product UI: white canvas, Plus Jakarta Sans, red CTA, blue links, four brand accents. Dual theme still uses html[data-theme]. Hard-refresh if a previous theme is cached.

Colour tokens

Swatches read live CSS variables, so they follow light and dark. Hex lives only in tokens.css.

primary
primary-hover
background
surface
text
muted
brand-red
brand-green
brand-blue
brand-yellow

Dual theme

Use the sun/moon control in the header. Unset preference follows the operating system; the toggle stores light or dark in localStorage as 8om-w2-theme.

How pages pick a theme

A boot script sets data-theme before paint. Components use tokens only. Dashboard, Composer, and tenant sites are unchanged.

Logo

Final mark: red nucleus, green electron, blue/yellow orbit (Google hexes). Same icon in light and dark; only the 8om wordmark ink flips. Favicon and app icons use the mark alone. Header and footer use the full lockup.

Mark / favicon

Lockup (in use)

Typography

Plus Jakarta Sans. Product-site scale with tight display headlines.

Display / H1 — One platform. Digital tools.

H2 — Explore 8om tools

H3 — QR Code Generator

Body — Create, manage, market and grow with free allowances on every public tool.

Small / muted — Free: try without an account

Buttons and search

Tool cards

Create Free tool

QR Code Generator

Create a custom QR code in seconds. No app required.

Try free — no account needed

Create Free tool

URL Shortener

Turn long links into short 8om.in URLs you can share and track.

Try free — no account needed

Create Paid product

AI Website Builder

Generate a business website with AI. Hosting and pages included.

Business Paid product

NFC Business Cards

Share your profile, website, and contacts with one tap.

Files Free tool

Reduce Image Size

Compress an image while keeping it sharp enough for the web.

Try free on the public page

Files Free tool

PDF to Word

Turn a PDF into an editable Word document.

Try free on the public page

FAQ component

Is this the live homepage?

No. This preview is noindex. Production `/` still uses `cms/nfc_home.html` until the homepage flag is on.

Alerts, prompts, and toasts

Use inline alerts on the form. Login required is a prompt, not a disappearing snackbar. Toasts are optional short confirmations.

QR code is ready to download.
7 of 10 free uses remaining this month.
File tools stay behind sign-in in this wave.

Sign in to save results, keep history, and continue after the free allowance.

Breadcrumb and form controls

Use HTTPS. Result stays on this page.

Enter a valid HTTPS URL.

Login required

Save, history, and extra allowance need an 8om account. The public tool stays on this page.

Login