Start a project

A calm place to read and write.

Clarity is a free reading and writing space with three comfort modes, read-aloud in six languages, and Markdown. Open it in your browser, or install it and keep working offline.

Open Clarity Download Clarity See what's inside
Built by NOOR Productions, a web design and development studio

Notes on slow reading

The eye tires before the mind does. A page that is easy on the eyes lets your attention stay on the words. Change the mode at the top of this page and watch the whole room change with it.

Everything Clarity does

A small set of tools, each built to stay out of your way. Five highlights first, then the full feature list.

Three modes, three backdrops

Dark, Bright and Eye care each have their own animated backgrounds, such as Aurora, Clouds and Embers, so the space suits the hour and your eyes. Pick one to try it on this page.

Reads it aloud

Clarity reads your text using the voices on your device, in:

  • English
  • French
  • Portuguese (Brazil)
  • Spanish
  • German
  • Mandarin Chinese

No English voice on your device? Clarity can download one in a single click.

Write in Markdown

Try it. Type up to 50 characters with simple marks, then press Preview.

Try # for a heading, **bold**, *italic* or - for a list.

45 of 50

Export when you're done

Save your document as a text file, a Markdown file or a PDF. An empty document can't be exported, so you never end up with a blank file.

Install it, use it offline

Clarity is a progressive web app. Add it to your home screen or desktop and it keeps working without a connection. The one-click English voice needs a connection the first time you download it.

The full feature list

The tiles above are the highlights. Here is everything else Clarity does, group by group.

Comfort modes and contrast

  • Three modesDark, Bright and Eye care. Switch any time, and each mode keeps its own settings.
  • Eye care tuningTwo sliders set brightness (8 to 60%) and warmth (20 to 55°), so you can cut blue light for night reading.
  • Live contrast checkA badge in the header shows how strongly your text stands out from the background, graded AAA, AA or Too low. It updates as you change mode or Eye care levels.
  • Colors for each modeEach mode has its own text, accent, panel and border colors, chosen to stay readable.

Animated backgrounds

  • Dark modeNone, Aurora, Stars, Waves, Bubbles or Snowfall.
  • Bright modeNone, Clouds, Pastel Drift or Waves.
  • Eye care modeNone, Embers, Stars or Snowfall.
  • One pick per modeClarity remembers the background you chose in each mode.
  • Behind the textThe animation sits behind the text card, so it never lowers contrast. Choose None to switch it off.

Type and layout

  • 14 fontsSystem Sans, Atkinson Hyperlegible (easy-read), Inter, Source Sans, System Serif, Lora, Merriweather, Literata, EB Garamond, Playfair Display, IBM Plex Mono, Roboto Mono, Caveat and Comic Neue.
  • Font sizeFrom 14px to 32px.
  • Line spacingFrom tight (1.30) to airy (2.20).
  • Line widthFrom 45 to 95 characters per line, so lines never run too long to follow.

Writing and editing

  • Paste cleanPaste plain text or Markdown and no formatting from the source comes along.
  • Title fieldName your document, or leave it blank and Clarity names it for you.
  • Edit and PreviewSwitch between writing and the formatted page. The preview updates as you type.
  • Word and character countAlways visible below your settings.
  • Line breaks keptEvery time you press Enter, the break stays, so pasted text keeps its shape.

Markdown

  • HeadingsThree levels, with # marks.
  • Bold and italicUse ** or __ for bold, and * or _ for italic.
  • CodeInline code and fenced code blocks.
  • ListsBulleted lists with - or *, and numbered lists.
  • Quotes and dividersBlockquotes and horizontal rules.
  • LinksLinks open in a new tab.
  • Safe by defaultHTML you type shows up as text and never runs.

Saving and your documents

  • Save and NewSave a document, or start a fresh one.
  • Saved listYour documents sit newest first, with how long ago you changed them. Click to open, or press × to delete.
  • Automatic titlesNo title? Clarity uses the first line, up to 48 characters.
  • Auto-saved draftYour draft saves about a second after you stop typing, and comes back when you return.
  • Save messagesClarity tells you when changes are unsaved, saved, loaded or restored.
  • Settings rememberedMode, fonts, sizes, Eye care levels, backgrounds, language, voice and speed all stay as you left them.
  • Stays on your deviceDocuments and settings live in your browser. There is no account to make. Clearing your browser data removes them, so export anything you want to keep.
  • Storage warningIf your browser blocks storage, Clarity says so instead of failing quietly.

Listen

  • Six languagesEnglish, French, Portuguese (Brazil), Spanish, German and Mandarin Chinese.
  • Best voice picked for youClarity ranks the voices on your device and picks the most natural one for the language you choose.
  • Clear voice statusLanguages with no voice on your device are marked, and Clarity lists which ones are missing.
  • Advanced voice pickerChoose a specific voice. Higher-quality voices get a ★, you get a warning if the voice doesn't match your language, and Undo takes you back to the automatic choice.
  • Free English voiceNo English voice on your device? Download one in a single click (about 90 MB, once). Clarity shows real progress, tests the voice before calling it ready, and offers Retry if it fails.
  • SpeedFrom 0.60x to 1.60x.
  • Play, pause, resume, stopWith a status line that says what's happening.
  • Reads the words, not the marksMarkdown symbols aren't spoken, code blocks are skipped, and links are read as their text.
  • Clear fallbackIf your browser can't read aloud, Clarity says so.

Export and copy

  • Three formatsText (.txt), Markdown (.md) and PDF.
  • PDF that looks like your pageThe PDF uses your current mode colors, font, size and spacing. A title prints only if you typed one.
  • Copy and ClearCopy your text to the clipboard, or clear the editor.
  • Dated file namesFiles are named from your title, with the date and time added.
  • No empty filesAn empty document can't be exported, and Clarity tells you why.

Keyboard shortcuts

  • SaveCtrl/⌘ S
  • New documentCtrl/⌘ N
  • Export PDFCtrl/⌘ P
  • Download .txtCtrl/⌘ Shift D
  • Download .mdCtrl/⌘ Shift M
  • Edit or PreviewCtrl/⌘ E
  • Play or pause readingCtrl/⌘ Shift L
  • Dark, Bright or Eye careCtrl/⌘ 1 2 3
  • Show all shortcuts? or the ? button in the header. Esc closes it.

Install and offline

  • Install as an appIt opens in its own window. Use the Install Clarity button when your browser offers it, or Add to Home Screen on iPhone and iPad.
  • Works offlineAfter you install it, Clarity opens and runs without a connection, even from a cold start.
  • Updates itselfWhen a new version ships, the old saved copy is cleared and the new one takes over.
  • Home-screen iconsIcons for phones and desktops, including the rounded kind Android uses.
  • What needs a connectionFonts load from the web, so offline Clarity shows your device's fonts instead. The free English voice needs a connection to download.

Accessibility and small screens

  • Visible keyboard focusA clear outline shows where you are on every button, field and the editor.
  • Screen reader labelsControls such as the mode switch, Edit and Preview, and delete buttons are labeled. The animated background is hidden from screen readers.
  • Preview you can reachYou can tab into the preview to scroll it with the keyboard.
  • Easy-read fontAtkinson Hyperlegible is one click away in the font list.
  • Phones and small screensOn narrow screens the settings move below the editor, so nothing gets squeezed.

Clarity is a NOOR Productions build.

NOOR Productions is a web design and development studio. We design, build and launch websites and web apps for businesses, and we build them to be found. Clarity is the product we made for ourselves first, to show how we work.

Start a project See our work

Read how we built Clarity

6
languages for read-aloud
3
comfort modes
3
export formats

What that means for your project

  • Works offline

    A website that behaves like an app, so your customers can keep using it on a weak connection.

  • Accessible by default

    Readable type, strong contrast and visible keyboard focus mean more people can use what we build.

  • Tested in real browsers

    Clarity went through several rounds of testing in real browsers, and every bug we found was fixed before launch.

Questions

Is Clarity free?

Yes. Clarity is free to use in your browser.

Does Clarity work offline?

Yes. Install it from your browser's install button, or use Add to Home Screen on an iPhone or iPad, and it keeps working without a connection. The one-click English voice needs a connection the first time you download it.

Which languages can Clarity read aloud?

English, French, Portuguese (Brazil), Spanish, German and Mandarin Chinese, using the voices on your device. If a voice is missing, Clarity tells you. For English, it can download a voice for you in one click.

What can I export?

Text (.txt), Markdown (.md) and PDF. An empty document can't be exported.

Do I need an account, and where are my documents kept?

No account. Your documents, drafts and settings are saved in your browser on your device. Clearing your browser data removes them, so export anything you want to keep.

Can I change the font and text size?

Yes. Pick from 14 fonts, including an easy-read one, then set the size (14 to 32px), line spacing and line width. Clarity remembers your choices.

What are the keyboard shortcuts?

Press ? in Clarity to see them all. They cover saving, new document, PDF export, downloads, Edit and Preview, read-aloud, and switching modes. The full list is in Keyboard shortcuts above.

Who made Clarity?

Clarity is built and maintained by NOOR Productions, a web design and development studio.