BYTETOOLS

Link in Bio Page Generator

Build a self-contained link-in-bio page: avatar, bio, styled buttons, an icon row, theme colour and dark mode, all inlined into one downloadable HTML file.

Avatar

Drop a square photo, or click to chooseCropped to a 240×240 circle and embedded as a data URI — never uploaded.

Link buttons

Icon row

Icons are generic hand-drawn SVG shapes, not platform logos — you can publish the file without worrying about trademark artwork.

Alex Rivera

Product designer • Newsletter twice a month • Coffee enthusiast

Read the newsletter
Latest case study
Book a 20-minute call

The download is one self-contained file: CSS is inline, the avatar is a data URI, and there are no scripts, fonts or images loaded from anywhere else. Drop it on any static host — GitHub Pages, Netlify, Cloudflare Pages or an S3 bucket — and it works offline too. Your photo is resized on a canvas in your own browser and never uploaded.

What is the Link in Bio Page Generator?

A link-in-bio generator that builds a single self-contained index.html file with your avatar embedded as a data URI, inline CSS, styled link buttons and an optional prefers-color-scheme dark block — no hosting service or account required.

  • One self-contained file — inline CSS, embedded avatar, zero external requests
  • Avatar cropped and resized on a canvas in your browser
  • Filled, outline or soft-tint buttons with pill or rounded corners
  • Optional prefers-color-scheme dark block generated for you
  • Generic hand-drawn SVG icons, so no platform logos ship in your file
  • URLs restricted to http, https, mailto and tel; all text HTML-escaped

How to use the Link in Bio Page Generator

  1. 1

    Enter your name and bio, then pick an accent colour and background colour.

  2. 2

    Drop in a photo — it is cropped to a circle and embedded in the file, never uploaded.

  3. 3

    Add your link buttons as label and URL pairs, and add an icon row with a generic glyph for each destination.

  4. 4

    Choose the button style, corner shape and whether to include a dark-mode block.

  5. 5

    Check the live preview, then copy the HTML or download index.html and upload it to any static host.

About the Link in Bio Page Generator

Link-in-bio services are convenient until they start charging, showing their own branding or disappearing. This generator produces the same thing as one plain HTML file you own: avatar, name, bio, styled link buttons and a small icon row, with all the CSS inlined and no external requests at all.

Your photo is loaded, cropped square and resized to 240 pixels on a canvas in your own browser, then embedded directly in the file as a data URI. That means the page has no image to fetch, works offline and can be dropped on GitHub Pages, Netlify, Cloudflare Pages or any static host without another file beside it.

You choose an accent colour, a background, filled, outline or soft-tint buttons, pill or rounded corners and whether to include a prefers-color-scheme dark block. Link URLs are checked so only http, https, mailto and tel addresses are written into the page. Nothing is uploaded — the whole build happens locally.

Frequently asked questions

How do I make a link in bio page for free?

Fill in your name, bio and links here, download the index.html file and upload it to any free static host such as GitHub Pages, Netlify or Cloudflare Pages. There is no account, no subscription and no branding added to the page.

Where do I host the file this generates?

Anywhere that serves static files. GitHub Pages, Netlify Drop, Cloudflare Pages, Vercel, an S3 bucket or a subfolder of your existing site all work, because the page is a single file with no dependencies.

Will the page work on phones?

Yes. The generated CSS uses a fluid max-width layout with full-width tap targets and includes a viewport meta tag. If you enable the dark block it also follows the visitor's system light or dark preference.

Is my photo uploaded anywhere?

No. The image is read by your browser, drawn to a canvas, cropped square, resized and turned into a data URI locally. It only ever leaves your device when you upload the finished HTML file yourself.

Why are the icons generic shapes instead of platform logos?

Platform logos are trademarked artwork with their own brand guidelines. The glyphs here are simple hand-drawn shapes — a globe, an envelope, a play triangle — so you can publish the file without licensing someone else's logo.

Related tools