
Template details
Contour
Free Astro one-page portfolio template with a working serverless contact form powered by Formgong.
About this template
Contour is a free, MIT-licensed Astro template for a one-page freelance developer or small studio portfolio, delivered with a working contact form that needs no backend server.
What is Contour?
Contour is a one-page portfolio template built on Astro, aimed at freelance developers or small studios that build websites and AI features for agencies. The template ships as static source: you edit a single src/content.json file to change every piece of text on the page, then build a static site into dist/. It is published by Formgong, the same company that provides the form backend the template posts to, and the demo names, texts and photos are fictional sample content rather than real clients.
Key Features
- Astro framework — a static-site build (
npm run buildoutputs todist/) that deploys to Netlify, Vercel, Cloudflare or any static host; one-click deploy buttons are provided for all three. - Single-file content editing — every text on the page lives in
src/content.json, including form settings underform.access_key. - Working contact form without a server — the form posts directly to
https://formgong.com/submit; no PHP, no serverless function, no backend to host. - Form fields and payload — submissions send
access_key,subject,botcheck,name,email,company,budgetandmessage. - Honeypot spam protection — a
botcheckfield filters bots, and the page shows success or error states from the real server answer, displaying a thanks message only when Formgong returnssuccess: true. - Bundled fonts — Geist and Geist Mono ship as WOFF2 files (Latin and Latin Extended) with no requests to Google Fonts; SIL Open Font License 1.1 texts sit beside the font files.
- Blueprint visual style — warm off-white paper background, ink type, one cobalt accent, mono labels and a layout grid you can switch on.
- Bundled motion stack — GSAP with ScrollTrigger and SplitText plus Lenis smooth scrolling, included in the template.
- Privacy page included — the form and footer link to
/privacy/, a neutral sample page served frompublic/privacy/index.html.
Who is it for?
- Freelance developers who want a single-page portfolio with a contact form that collects project enquiries without standing up a server.
- Small studios that build websites and AI features for agencies and need a fast, static landing page to present work.
- Developers who already use Formgong and want the form's access key wired into a ready-made layout.
- Anyone deploying to static hosts who needs a build that drops into Netlify, Vercel or Cloudflare with no runtime.
What can you do with Contour?
- Launch a portfolio quickly: replace the fictional project images (seven files in
public/img/) and the text insrc/content.jsonwith your own work, then deploy the staticdistoutput. - Collect qualified project enquiries: the form asks for name, email, company, budget and message, and delivers submissions by email, with optional Telegram, Slack or Discord notifications through Formgong.
- Run on a free form plan: Formgong offers a free plan, so you can create a form, copy its access key and start receiving messages without paying.
How does Contour work?
The template ships with a placeholder access key. Create a form at Formgong, copy its access key, and replace fk_your_access_key under form.access_key in src/content.json. Then run npm install and npm run dev to preview at http://localhost:4321, or npm run build to produce the static site in dist/.
Pricing
Contour is free and MIT licensed. The contact form relies on Formgong, which has a free plan for creating a form.
FAQ
Is Contour free?
Yes. Contour is released under the MIT license by Formgong, so you can use and modify it. The bundled photos and demo names are fictional sample content generated with FLUX and should be replaced before launch.
Does the contact form require a backend?
No. The form posts straight to Formgong's submit endpoint, so there is no PHP, serverless function or server to host. You only need a Formgong access key placed in src/content.json.
What fonts does Contour use?
Geist and Geist Mono are bundled as WOFF2 files covering Latin and Latin Extended, so the page makes no requests to Google Fonts. The licence texts ship next to the font files under the SIL Open Font License 1.1.
Can I deploy Contour to any static host?
The build command is npm run build and the output directory is dist, which works on Netlify, Vercel, Cloudflare and any static host. One-click deploy buttons for those three services are included in the repository readme.















