Skip to content
Benjamin Olsen

Tools & practical guides

Build better websites.
One useful step
at a time.

Free browser tools and practical Oxygen guides for the next thing you need to build.

Find a useful tool Explore Oxygen guides →

A little type, a lot of possibilities

320 px

Type that adapts.

1440 px

Type that adapts.

CSS clamp() · responsive typography

Made by Benjamin Olsen · Web development teacher in Denmark

Choose your next step

What are you building today?

Start with a small task. Leave with something you can use.

01

Make a heading
scale smoothly

Generate fluid CSS and check the endpoints.

Open the tool →
02

Choose readable
text colors

Check contrast and try a more readable pair.

Open the tool →
03

Connect useful
pages

Review internal-link suggestions and export a plan.

Open the tool →
04

Give Oxygen pages
a shared template

Keep the frame consistent and each page’s content its own.

Read the guide →

Preparing to go live? Open the launch checklist →

Try something useful

Readable colors.
A clear answer.

Check a color pair before it becomes part of your design.

A contrast result checks one part of accessibility. Review the finished page too.

Open the full contrast checker →
21:1

AA normal text: Pass

AAA normal text: Pass

Normal text: AA 4.5:1 · AAA 7:1
Readable text starts here.

One project, six practical stages

From a blank page to a
website you can launch.

Build a small service website in Oxygen. Follow the decisions, use the tools, and check the result at each stage.

Start the project →
  1. 01

    Plan

    Choose the pages and their purpose.

  2. 02

    Write

    Give each page a clear next step.

  3. 03

    Design

    Choose a reusable starting layout.

  4. 04

    Build

    Bring your pages together in Oxygen.

  5. 05

    Check

    Test real content, links and mobile layouts.

  6. 06

    Launch

    Verify the site and keep a handover.

Already building? Open the launch checklist →

A few good places to start

Useful now. Worth keeping.

Browse the library →

A small selection of guides and resources to put to work on your next website.

Oxygen 6 · Guide

Template Content Area, explained.

Give service pages a shared frame while keeping their content separate.

Read the guide →

Browser tool

A checklist for the next launch.

Keep project notes, track the checks and export a handover.

Open the checklist →

Oxygen designs

A useful starting layout.

Explore reusable layouts, then adapt the content to your project.

Browse the designs →

The person behind the tools

Hi, I’m Benjamin.

I teach web development in Denmark and spend a lot of time working with WordPress, Oxygen and the details that make websites easier to build.

I share small tools and clear examples you can put to work on your own projects.

Practical examples Clear limits and version notes
About me → Ask a question →