Inazuma

Inazuma is a free, open-source company landing page template built with Tailwind CSS, HTML, CSS, and JavaScript, created by Ranyeh for launching complete company websites.

What is Inazuma?

Inazuma is a responsive landing page template for companies, distributed as a static website that runs entirely in the browser with no build step required to view. It takes plain HTML, CSS, and JavaScript source files and produces a finished company landing page with a hero section, call-to-action buttons, dark and light modes, and scroll animations. The template is authored by Ranyeh (GitHub user ranyeh24), is the Tailwind CSS adaptation of the original Inazuma template, and its design is inspired by Play, a free Tailwind CSS template by TailGrids.

Key Features

• Responsive navbar with CTA and dark mode buttons — the navigation bar includes a call-to-action button and a theme toggle, adapting to mobile screens.
• Hero section with CTA and intro video buttons — the landing hero includes two buttons: one for the primary call-to-action and one that opens an intro video via GLightbox.
• Scroll animations — ScrollReveal adds entrance animations to elements as the user scrolls, with no page reload.
• Smooth scrolling — anchor links in the navigation scroll smoothly to each section on the page.
• Dark and light theme — the template ships with a built-in dark mode toggle that switches the entire color scheme.
• Responsive footer — a mobile-friendly footer is included, matching the layout of the rest of the site.
• SEO-friendly — semantic markup and meta tags are structured to help search engines index the single-page site.
• Browser compatibility — the template is designed to work consistently across all modern web browsers.

Who is it for?

Inazuma is for companies and startups that need a clean, modern landing page without paying for a proprietary template. Web developers who are learning Tailwind CSS can use the source as a reference for how to structure a responsive layout, wire up dark mode, and integrate animation libraries. Freelancers can download the template and adapt colors, fonts, and sections to fit a client's brand, then host the static files on any web server. Because it is MIT-licensed, agencies can reuse it in client projects without attribution.

What can you do with it?

• Company landing pages: Present a company's services, features, and call-to-action on a single page with a video intro, perfect for product launches or corporate sites.
• Learning Tailwind CSS: Fork or inspect the code to see how a complete landing page uses Tailwind utility classes, custom configuration, and plugin integration.
• Rapid prototyping: Download the template, swap in company copy and Unsplash images, and have a demo-ready landing page in minutes.

How does Inazuma work?

Inazuma is a static site, so you can run it by cloning the repository and opening index.html directly in a web browser. For deeper customization, edit the tailwind.config.js file to change colors and default font, then update the tailwind.css file with the new Google Fonts link. No installation or build tool is required unless you want to modify the Tailwind configuration and recompile the CSS.

Pricing

Inazuma is completely free and open-source. It is released under the MIT License, so you can use it in personal or commercial projects without attribution or backlinks.

FAQ

Is Inazuma free?

Yes, Inazuma is free and open-source. It is released under the MIT License, which permits unrestricted use in personal and commercial projects with no required attribution.

How do I customize the colors in Inazuma?

Open the tailwind.config.js file and modify the color values under the theme.extend.colors section. Update both the config keys and the corresponding class names used in the HTML to change the site's palette.

Does Inazuma include dark mode?

Yes, Inazuma ships with a built-in dark and light theme toggle. The navbar includes a button that switches the site's color scheme instantly.

What plugins does Inazuma use?

Inazuma integrates ScrollReveal for scroll animations, GLightbox for the intro video lightbox, and Lineicons for the icon set used throughout the template.

What is the license for Inazuma?

Inazuma is licensed under the MIT License, so you are free to modify and redistribute it for personal or commercial purposes without requiring permission.