Skip to content

silicatelabs/LinkHub-OSS

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

4 Commits
 
 
 
 
 
 

Repository files navigation

LinkHub — Open Source

A single HTML file that lets anyone create a beautiful link-in-bio page. No signup. No server. No build step. Just open and use.


What is this?

LinkHub is a link-in-bio page builder — like Linktree, but you own it completely. It's a single .html file that runs entirely in your browser. Your data stays on your device unless you choose to connect a database.

Think of it as: The tool to build the page, and the page itself — both in one file.


Features

  • 12 premium themes — Aurora, Ocean, Sunset, Forest, Midnight, and more
  • Unlimited links — add, reorder (drag & drop), feature, hide, delete
  • Avatar upload — auto-resized to 512×512 in your browser
  • Live preview — phone mockup updates as you type
  • No account needed — works offline, data in your browser's localStorage
  • Export page — download a standalone HTML file you can host anywhere
  • Export/import data — backup your content as JSON
  • Optional database — connect Supabase to save permanently and share across devices
  • Keyboard shortcut — Ctrl/Cmd+S to save
  • SEO fields — custom title and meta description
  • Mobile-first — the public page works perfectly on phones

Quickstart

Option 1 — Open directly in your browser:

Double-click linkhub.html

That's it. Fill in your name, add links, pick a theme.

Option 2 — Host it online (free options):

Host How
Netlify Drop Drag linkhub.html onto the page
GitHub Pages Push to a repo, enable Pages, rename to index.html
Vercel Import GitHub repo as static site
Any web hosting / cPanel Upload via File Manager or FTP

Option 3 — Connect a database (for permanent, shareable URLs):

See Database Setup below.


How it works

linkhub.html
│
├── Welcome screen    → Choose to create or continue editing
├── Builder           → Edit profile, links, appearance, settings
│   ├── Links tab     → Add/edit/reorder links
│   ├── Style tab     → Pick theme, button style, SEO settings
│   └── Settings tab  → Connect database, export/import, deploy help
└── Public preview    → Full-screen view of your page

Data storage:

Mode Where data lives Shareable URL
Default Browser localStorage No (local only)
Downloaded file Baked into the HTML file Deploy the file anywhere
Database connected Supabase (your account) Yes

Database Setup

Connecting a database lets you:

  • Access your page from any device
  • Share a permanent URL with others
  • Enable analytics (page views, link clicks)

It takes about 5 minutes and costs $0:

Step 1 — Create a Supabase project

  1. Go to supabase.com → sign up free
  2. Click New project → give it a name → wait ~2 minutes

Step 2 — Run the schema

  1. In your project: SQL Editor → New query
  2. Open schema.sql from this folder
  3. Paste the entire contents → click Run

Step 3 — Get your keys

  1. Settings → API
  2. Copy Project URL and anon public key

Step 4 — Connect in LinkHub

  1. Open linkhub.htmlBuilder → Settings tab
  2. Paste your URL and anon key → click Connect database

Your page will now save to Supabase automatically. Any changes you make sync instantly.


Deploying your page

As a standalone file (no server needed)

Click Share → Download file in the builder. This generates a self-contained HTML file (e.g. yourname.html) with:

  • All your data baked in
  • All themes included
  • Proper OG meta tags for WhatsApp/Twitter previews
  • No external dependencies

Upload this file anywhere. Rename it to index.html for GitHub Pages/Netlify.

As a database-backed page

If you've connected Supabase, your page is accessible at:

your-linkhub-deployment.com/?page=yourslug

Or if you deploy the full SaaS version (see /saas folder), at:

yourdomain.com/yourslug

Customizing

Adding your own domain

If you host the HTML file on a custom domain, visitors see your domain in the URL bar. No code changes needed.

Modifying themes

Themes are defined as CSS classes at the bottom of the <style> block. Each theme sets four CSS variables:

.theme-yourtheme {
  --pg: /* background gradient */;
  --bt: /* button background */;
  --tx: /* text color */;
}

Add your own theme by adding a new class and a new entry in the THEMES object in the <script> section.

Changing the branding

Search for LinkHub in the file and replace with your name/brand. The branding toggle in Settings lets users hide the "Create yours" footer link.


File Structure

linkhub-oss/
├── linkhub.html    ← The entire app. This is all you need.
├── schema.sql      ← Optional: run in Supabase to enable DB features
└── README.md       ← This file

That's the entire project. One HTML file, one SQL file, one README.


Browser Compatibility

Works in all modern browsers. No polyfills needed.

Browser Support
Chrome / Edge ✓ Full
Firefox ✓ Full
Safari ✓ Full
Mobile browsers ✓ Full
IE 11 ✗ Not supported

Privacy

  • Default mode: Nothing leaves your device. Zero network requests.
  • Database mode: Your data goes to your own Supabase project. We have no access to it.
  • No analytics are loaded by default. No cookies. No tracking.

Frequently Asked Questions

Can I use this commercially? Yes. MIT license. Use it however you want.

Can multiple people use one deployment? In database mode, yes — each person gets their own slug. In file mode, it's one page per file.

Can I remove the "Create yours" branding? Yes — toggle it off in Settings → Appearance or remove it from the code.

What happens if Supabase goes down? Your data is also in localStorage. You can always export it as JSON.

Can I self-host the database? Any Postgres database with a PostgREST API works. Supabase is the easiest free option.

I want to add authentication so only I can edit my page. Add Supabase Auth and update the RLS policies in schema.sql. The schema.sql file has comments explaining where to add auth checks.


License

MIT — do whatever you want with it.


Contributing

This is intentionally a single-file project. Pull requests that add features without increasing complexity are welcome. If you're adding something significant, open an issue first to discuss.

Ground rules:

  • It must remain a single HTML file
  • No build step
  • No npm install
  • Works offline by default

Built with care. Designed to last.

About

A single HTML file that lets anyone create a beautiful link-in-bio page. No signup. No server. No build step. Just open and use.

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

 
 
 

Contributors