How to customise a website template so it does not look like a template

By Core Concepts · · Setup

People do not recognise a template by its layout. They recognise it by the things nobody changed: the default font, the stock photo of a handshake, the headline that could be about anyone. Change those and the layout becomes yours.

These five changes are in order of impact.

1. Write your own words first

Copy does more to make a site yours than any visual change. Replace every headline with something only your business could say. "A quiet place at the edge of the sea" belongs to one hotel. "Welcome to our website" belongs to nobody.

Keep the length close to the demo text. The design was balanced around those line lengths, and a headline three times as long will not sit the same way.

2. Change the typeface

Type is the fastest way to change the personality of a page. Most templates use two fonts: one for headings and one for body text. Swapping only the heading font is enough to shift the whole mood.

In our templates fonts are set in one place, app/layout.tsx, and loaded from Google Fonts, so there is nothing to license. Stay in the same family of style as the original, serif for serif, to keep the proportions working.

3. Set your colours

Good templates define colour as a few named variables rather than hundreds of scattered values. Ours keep them at the top of app/globals.css: a background, a text colour and one accent.

Resist adding more. A single accent used sparingly looks more expensive than five colours used everywhere.

4. Use your own photography

Demo photographs are placeholders. Replacing them is the change visitors notice most, and the one that makes the site honest. A few practical points:

  • Use landscape images at least 2000 pixels wide for large sections.
  • Keep a consistent look: similar light, similar colour.
  • If you have no good photographs, pick a template that does not need them. Numa and Murmur draw every visual in code.

5. Remove what you do not need

A template shows everything it can do. Your site should show only what you need. If you have no awards, delete the awards section. If you have three services, do not invent a fourth to fill the grid. Shorter pages that are completely true convert better than long ones padded with filler.

What to leave alone

Spacing, the grid and the timing of animations are where most of the design skill went. They are also the easiest things to break. Change the content and the surface first, and only then decide whether the structure needs to move.

The one-hour version

If you only have an hour: rewrite the hero headline, change the heading font, set your accent colour and replace the first photograph. That alone takes a template most of the way to looking like yours.

Every template we sell is built to be changed this way. Pick one that fits your business.

Templates in this article

  • Orra: An ultra-modern homepage for boutique hotels and places to stay. $79.
  • Selah: A calm, warm homepage for pilates, yoga and wellness studios. $79.