Getting Started

Quick Start

KitFront helps you build website frontends faster by combining starter kits, 500+ production-ready sections, and a simple copy-to-project workflow.

Before you begin

Decide whether your project will use Bootstrap or Tailwind CSS. Each framework has its own starter kit and matching section code.

Recommended workflow

Step 1

Download starter kit

Download the Bootstrap or Tailwind starter kit and use it as the foundation for your project.

Step 2

Choose sections

Browse the Section Library, preview layouts, and choose the sections your page needs.

Step 3

Copy and paste

Copy the code for your selected framework and paste it into the starter files. Bootstrap sections include matching CSS; Tailwind sections usually do not need separate CSS.

Step 4

Customize content

Replace demo text, images, links, and colors with your real website content and brand details.

What to copy

Bootstrap sections: copy HTML, copy the matching section CSS, and copy JavaScript only when the section includes it.
Tailwind sections: copy HTML and copy JavaScript only when the section includes it.
Use the Starter Kit guide for exact file locations.

Access levels

You can explore KitFront before upgrading. Browse sections from the Section Library and compare plans on the Pricing page.

Guest users can browse categories and preview section layouts.
Free accounts can access and copy code from free sections.
Pro accounts can access all sections and premium features.

Introduction

Preview