DEV Community

Segcam spa
Segcam spa

Posted on

I built 42 landing page templates as single HTML files (no npm, no build step)

I got tired of downloading a "simple landing page template" and finding a 400 MB folder with npm, a build step, a config file and three CSS frameworks I never asked for.

So we built the opposite: templates that are one single HTML file. All the CSS in a <style> tag, all the JS inline. No frameworks, no CDNs, no build step, no dependencies. You open the file, you edit the text, you upload it anywhere. It works offline.

Free one: a coming-soon page

Take it, no signup, no email wall:

👉 Free coming-soon template (live demo + download)

It has a working countdown, an email capture form, feature highlights and social links. Commercial use allowed — just don't resell the template itself.

Why single-file?

Because most landing pages don't need a toolchain. They need to load fast and be easy to change.

  • Editable by anyone. Your client can change the phone number without calling you.
  • Deploy anywhere. Cloudflare Pages, Netlify, GitHub Pages, a $3 shared host, an S3 bucket.
  • Nothing to break. No node_modules, no lockfile, no "works on my machine".
  • Fast by default. One request for the HTML, zero render-blocking libraries.

The trade-off is real and I won't hide it: if you're building an app with state, routing and a dozen components, a single HTML file is the wrong tool. This is for landing pages, portfolios, restaurant menus, coming-soon pages, clinic sites — the stuff that is 90% content.

What we ended up with

We kept building them for different niches and now there are 42: SaaS, agency, e-commerce, restaurant, gym, real estate, law firm, medical clinic, crypto/Web3, podcast, esports, construction, car dealership, interior design, and more. Every one is a single file, fully responsive, with real copy instead of lorem ipsum.

You can browse the live demos here: segcom.net — the demos are the actual templates running in your browser, not screenshots.

The technical rules we follow

If you want to build your own single-file templates, these are the constraints that kept ours clean:

  1. No external requests, at all. No Google Fonts, no icon CDNs. Font stacks only (-apple-system, Segoe UI, Roboto...).
  2. Decoration with CSS, not images. Gradients, box-shadow and solid colors instead of background images.
  3. Icons as inline SVG primitives or Unicode. Simple shapes (circle, rect, line) — they never break, and they weigh nothing.
  4. Keep it under ~650 lines. If it doesn't fit, the page is doing too much.
  5. Mobile nav must actually work. A hamburger that toggles a class, vanilla JS, 6 lines.

That's it. No magic.


If you grab the free one and it saves you an afternoon, that's a win. If you want the rest, they're at segcom.net — and if you think a niche is missing, tell me in the comments and I'll build it.

Top comments (0)