vivid-labs/vivid-landing-template

A ready-to-use landing page template made with TypeScript, React, Next.js, and TailwindCSS.

Vivid Landing Page Template

This is a ready to use template for any landing page you need, built with React, NextJS, and Tailwind CSS.

Modelled after the Vivid landing page.

NOTE: If you are looking for a simpler alternative that is flatter and uses JS instead of TS, check out our simple template!

Preview

Features

• Fully modular and easy to extend

• Perfect lighthouse scores for great SEO

• Very accessible, passing checks for screen-readers and other browsing aids

• Easily customizable via Vivid, Tailwind configuration, global style presets, and component props

• Built-in light and dark modes

Getting Started

1. Install dependencies with yarn install (or the equivalent for other package managers)

2. Run the test app with yarn dev

Customizing

This template is made to be easily customizable! Using Vivid, you can command-click on any part of the page and immediately edit its code. Check out the Vivid docs for more information on how to style in-browser!

The components in the src/components directory provide an easy way to extend the page.

If you want to edit colors or fonts, simply edit styles/globals.css or tailwind.config.js.