OpenLinks

OpenLinks is a free, open-source Astro template for building link-in-bio pages, with all configuration — profile, links, theme, icons, and an optional adult-content warning — managed in a single JSON file.

What is OpenLinks?

OpenLinks is a free, open-source Astro template for creating customizable link-in-bio pages. It takes a single input file, OpenLinks.json, and produces a static, responsive page ready for deployment. The template is built with Astro and TypeScript, styled with TailwindCSS, and maintained by GitHub user E10YDEV under an MIT license. It ships with eight built-in themes defined in themes.ts: default, ocean, forest, sunrise, ness, arctic, cherry, and brutalism.

Key Features

• 100% JSON-driven configuration — Edit OpenLinks.json to set your display name, bio, avatar path, theme, an array of links (title, URL, icon path), and an optional adultContent flag that shows a +18 warning banner.
• Eight built-in themes — Switch the global appearance by changing the theme value in the JSON; themes are named default, ocean, forest, sunrise, ness, arctic, cherry, and brutalism, and you can define your own in themes.ts.
• Custom SVG icon support — Place SVG files in public/icons/ and reference the file path in each link's icon field.
• Responsive layout — The generated page is designed to display consistently on mobile and desktop viewports.
• SEO and social meta tags — OpenLinks includes meta tags optimized for sharing links on social media platforms.
• TailwindCSS styling — Global styles and Tailwind configuration live in src/styles and astro.config.mjs, so the look is straightforward to modify.
• Easy deployment — The static build output works with Vercel, Netlify, GitHub Pages, and other static hosts.
• Simple project structure — The repository organizes reusable components in src/components, layouts in src/layouts, utilities in src/lib, pages in src/pages, and static assets in public.

Who is it for?

• Creators and influencers — Set up a single link hub for social profiles, portfolios, stores, and contact pages without writing HTML or CSS.
• Developers who want a hackable template — Fork the repository, edit OpenLinks.json and themes.ts, and deploy a custom page with the npm scripts included.
• Small businesses — Direct customers from Instagram, TikTok, or email signatures to a clean page with their key links and offers.
• Anyone avoiding paid link-in-bio services — Because OpenLinks is MIT-licensed and self-hosted, there are no subscription fees or platform-imposed watermarks.

What can you do with OpenLinks?

• Social media managers: Route an Instagram or X bio to a single page that lists a blog, newsletter, online store, and contact links with custom SVG icons.
• Freelancers: Display a portfolio, booking link, and client contact options together, optionally enabling the +18 warning banner when needed.
• Hobbyists: Choose one of eight themes to match a personal brand, or edit themes.ts to create a completely custom color scheme.
• Open-source contributors: Extend the template with the planned link-sharing system, advanced layout customization, SVG icon coloring, and more themes described in the repository roadmap.

How does OpenLinks work?

Clone the repository from GitHub, run npm install, then edit OpenLinks.json to set profile details and links. Start the development server with npm run dev to preview at localhost:4321, and build for production with npm run build, which outputs to /dist. The project also provides npm run preview to test the production build locally.

Pricing

OpenLinks is free and open source under the MIT license. No paid tiers, premium features, or hosted plans are mentioned in the repository.

FAQ

Is OpenLinks free?

Yes, OpenLinks is free and open source under the MIT license. There is no paid version, and you can self-host it on Vercel, Netlify, GitHub Pages, or any other static host that supports Astro output.

What do I need to customize OpenLinks?

You only need to edit OpenLinks.json in the project root. Set your name, description, avatar path, theme, and an array of links with title, URL, and icon path. Optionally set adultContent to true to display a +18 warning banner.

Which frameworks and tools does OpenLinks use?

OpenLinks is built on Astro and TypeScript, styled with TailwindCSS, and configured through JSON. The repository includes Astro components, layouts, utility modules, pages, and a public folder for static files.

How do I change the theme?

Change the theme field in OpenLinks.json to any value available in themes.ts: default, ocean, forest, sunrise, ness, arctic, cherry, or brutalism. You can also edit themes.ts to add your own theme definitions.

Where can I report bugs or request features?

Open an issue or submit a pull request on the GitHub repository. Contributions are welcome, and the roadmap lists upcoming link sharing, advanced customization, SVG icon color support, and additional themes.