A little light for useful things.

A bit of warmth for the things you read, work on and share. Have a look around, try the switches and see what fits your next project.

Two modes describe the light: Night is lit against a dark ground; Day uses ink on a light ground. Three surfaces describe the work: Study gives reading room to breathe; Ledger helps people compare and work through information; Folio prepares content for print.

We’ll use a fictional community garden to try things out. The people, numbers and states are all made up.

Try the system

Try a different light or surface and see what changes. You can write a note too; it stays on this page and isn’t saved.

Field notes

The garden changes slowly. A short note is enough to remember what was noticed.

A note to keepNo note entered.Just a practice note. Nothing is saved.

Ready to try.

On the worktable

A compact table keeps state in words as well as colour.

Illustrative notes
Note	State	Updated
Window light	Ready	28 Oct
Autumn leaves	Review	29 Oct
Rainfall	Resting	30 Oct

A state describes the sample, not a live service.

Explore the full examples

Bring Lamplight into your project

Pick the download that suits your project. It’s free, and you’re welcome to make it your own. Download and unpack the files before following the examples below.

Download core · Download React adapter · Download browser starter · SHA-256 checksums · Build manifest

With a package manager

Install the downloaded core tarball from its local path. Using React? Add the adapter tarball and React too.

npm install ./lamplight-core-0.1.0-beta.5.tgz
npm install ./lamplight-react-0.1.0-beta.5.tgz react

Import @lamplight/core/styles.css and, if desired, @lamplight/core/fonts.css. React components are exported from @lamplight/react.

In a browser

Unpack the browser ZIP into your project, preserve its folders, and link its core stylesheet from your page. Put l-document on the html element or scope components with l-room.

<link rel="stylesheet" href="./core/lamplight.css">
<main class="l-room">...</main>

The stylesheet includes tokens, components, modes and surfaces. Add fonts or living light if they suit what you’re making.

Build with AI

Give your coding tool the extracted browser starter’s core folder, principles.md and the component reference. For a local project, the downloaded tarballs work too. Each tool handles files differently, so ask it what it can actually read. Fill in the brackets below, then check what it makes. A confident answer still deserves a look. Download the full AI starters guide.

Coding agents

Use this starter with Claude Code, Codex or another coding agent that can access your local project.

Common coding agent starter

Build [brief] for [audience] to help with [task]. Inspect the supplied Lamplight documentation and actual exports first. Use the downloaded local core tarball and, if needed, the React adapter tarball in a suitable local project, or the extracted core CSS folder. The Lamplight beta has not been published to npm; use downloaded files. Ask for any missing or unreadable files or unclear exports rather than inventing them.

Use actual Lamplight tokens and components. Choose Night or Day and a Study, Ledger or Folio surface suited to the brief; these are independent choices. Provide keyboard access, visible focus, states in words and reduced motion. Avoid coloured top or left bars on rounded panels. Keep fonts and living light opt-in. Produce a local preview and files for review; do not deploy.

Claude Design

Claude Code offers /design-sync for a code-based design system and /design for design work. Provide available code assets and confirm imports; Lamplight import is untested. Claude Design guide · Design system tutorial.

Claude Design starter

Create [brief] for [audience] to help with [task]. I will provide the Lamplight code assets and documentation available to this workspace. Inspect them and tell me which tokens and components were actually imported; ask for missing or unreadable files rather than inventing exports. Lamplight-specific import into Claude Design has not been tested.

Use actual Lamplight tokens and components. Choose Night or Day and a Study, Ledger or Folio surface suited to the brief; these are independent choices. Include keyboard access, visible focus, states in words and reduced motion. Avoid coloured top or left bars on rounded panels. Keep fonts and living light opt-in. Prepare a preview and files for review without deploying.

ChatGPT

For Codex and a local project, use the Coding agents starter above. For Sites, start in ChatGPT Work with a website request, attach available source files and save a version for review. Sites guide · Codex project guidance.

ChatGPT Sites starter

Build a website for [brief], serving [audience] with [task]. Use the attached Lamplight source files, CSS and documentation where available. Inspect the actual exports and ask for missing or unreadable files rather than inventing components. The Lamplight beta has not been published to npm; use downloaded files and do not assume an npm runtime.

Use actual tokens and components. Choose Night or Day and a Study, Ledger or Folio surface suited to the brief; these are independent choices. Include keyboard access, visible focus, states in words and reduced motion. Avoid coloured top or left bars on rounded panels. Keep fonts and living light opt-in. Save a version and provide its preview and files for review without deploying.

Gemini

Choose Canvas in Gemini for a file-based draft, or Build mode in AI Studio for an app project. Provide accessible files and review the code locally. Build mode documents React and Node/npm, but does not establish hosted installation of local tarballs. Build mode · Canvas.

Gemini files starter

Create [brief] for [audience] to help with [task]. Use the supplied accessible Lamplight source files, CSS and documentation. Inspect actual exports and ask for missing or unreadable files rather than inventing components. Do not assume hosted installation of local beta tarballs or CDN access.

Use actual tokens and components. Choose Night or Day and a Study, Ledger or Folio surface suited to the brief; these are independent choices. Include keyboard access, visible focus, states in words and reduced motion. Avoid coloured top or left bars on rounded panels. Keep fonts and living light opt-in. Return code and files suitable for a local preview and review without deploying.

Guidance checked 31 October 2026. Availability depends on your account and environment. The Lamplight beta has not been published to npm; use downloaded files.