How to Build and Edit a Personal Web Page with temper

Updated

temper is a browser-based editor that turns a single page of text into a downloadable HTML file. You click anywhere to start, edit paragraphs directly on the page, add links, adjust colors and typography in settings, then download the finished HTML and upload it to your own hosting. It suits anyone who wants a one-page personal site without writing markup or signing up for a site builder — as long as you already have somewhere to host a static file.

Getting started

There is no account step described on the site. The editor opens with a page already in progress: a first paragraph reading "This is the first paragraph. Here you could introduce yourself." Click anywhere on the page to begin editing.

The editing model is direct manipulation rather than a form:

  • Select a paragraph and type to replace its text.
  • Bottom-right buttons add or remove paragraphs.
  • The first paragraph cannot be removed. The remove action is blocked for it, so treat it as your introduction.
  • Top-right settings button opens metadata fields and appearance controls, and holds the download button.

Adding links

Links are created from text you have already typed:

  1. Type the link text inside a paragraph.
  2. Select that text.
  3. A link button appears in the bottom-right corner. Use it to attach the URL.

Two constraints matter here:

  • The link text must be unique within that paragraph. If the same words appear twice in one paragraph, the editor cannot tell which one you mean. Reword one instance.
  • The link dialog offers "Open in new window" and "Open in slideFrame (beta)." slideFrame only works with external HTTPS links that allow iFrame embedding — a site that sends an X-Frame-Options or frame-ancestors policy blocking embedding will not load inside it. If a link fails in slideFrame, use the normal new-window option.

Adjusting appearance and metadata

The settings panel (top-right) covers two things: your site's metadata and its look.

Metadata

  • Your site's title.

Appearance

Control Options shown
Text color Color picker
Background Color picker
Font A long list including Sans Serif, Serif, Monospace, System UI, and named families such as Chivo, Domine, EB Garamond, IBM Plex Mono, Karla, Montserrat, Playfair Display, Poppins, Space Mono, Work Sans, and others
Weight/style Bold, Italic
Font size Adjustable
Show temper branding Toggle — the panel notes "If you remove…", indicating branding can be turned off

Font choices are grouped by character — for example Scope, Scope Condensed, and Scope Expanded are variants of one family, and Golzheim, Golzheim Sans, and Massimo Grafia appear in several widths. Pick a family first, then a variant, rather than treating each entry as unrelated.

Downloading and publishing

The download button lives in the same settings panel. It generates your personalized HTML file from whatever is currently on the page.

From there the workflow is manual: upload that HTML file to your hosting. temper does not host the page for you — the site's own description is "Download your free HTML file and upload it to your hosting." So before you start, confirm you have a place to put a static HTML file (shared hosting, a static host, or a directory on an existing domain).

Common snags

  • A link won't attach. The selected text is probably duplicated elsewhere in the same paragraph. Make it unique.
  • slideFrame shows nothing. The target is not HTTPS, or it forbids iFrame embedding. Fall back to opening in a new window.
  • You deleted a paragraph by accident. The removal dialog asks "Are you sure you want to remove this paragraph? All contents will be deleted," with remove and cancel — read it before confirming, since there is no undo described.
  • You can't delete the first paragraph. That is intentional; it is the fixed introduction block.
  • You edited the page but the download looks stale. The HTML is generated at download time, so re-download after any change rather than reusing an earlier file.