LandingKit Pro - 55 HTML Landing Page Blocks

LandingKit Pro is a landing page, already built in 55 pieces. Navbars, heroes, features, pricing, FAQs, forms and footers in plain HTML, CSS and JavaScript. Copy the blocks you need, paste them in order and change two colours. No framework and no build step.

What you get

• 28 page sections: navbars, heroes, logo strip, feature grids, tabs, steps, integrations, comparison table, stats, testimonials, team, blog cards, pricing, FAQ, newsletter, contact form, calls to action and footers
• 15 split-screen heroes
• 12 pricing tables with a monthly and yearly switch and currencies
• 3 finished landing pages built from the sections

Good to know before you buy

• This is a static front-end kit. A static page cannot send email by itself, so the forms run in demo mode until you set the form action to your own form or email service
• The currency rates in the pricing tables are fixed numbers you choose. They are not live rates
• The names, numbers and quotes are sample content with invented companies. Replace them with your own
• Fonts load from Google Fonts. Everything else is inside the download
• Made for current versions of Chrome, Edge, Firefox and Safari, on desktop and mobile

In the download

• 55 blocks, each a complete HTML file that opens in the browser
• 3 finished pages
• A gallery page to browse everything
• Documentation page, README, changelog and license

Features

• Copy and paste: every block has clear markers that show what to copy
• Two colours for the whole page: every section follows two CSS variables, and tints and hover shades follow by themselves
• Blocks do not clash: each section carries its own styles and script with its own class prefix, with no global functions
• Real forms with labels, validation and status messages
• Working parts: mobile menu with dropdown, tabs, FAQ accordion, quote carousel, counting stats and a countdown hero
• Pricing tables with yearly discount and currencies set in one place
• Responsive: every layout stacks on phones
• Accessible: keyboard focus styles, aria-expanded and reduced-motion support
• No dependencies: no Node, npm, Tailwind or build tool

Requirements

• A current version of Chrome, Edge, Firefox or Safari
• A text editor to change the text, colours and links
• Any web host for static files. No server software, database or build tools are needed

Instructions

1. Unzip the download and open index.html in your browser. It is a gallery of everything in the kit
2. Copy a file from pages and edit the words, or start an empty page that loads assets/landingkit.css
3. Open a file from sections in a text editor, copy everything between COPY FROM HERE and COPY TO HERE, and paste it into your page
4. Set your two brand colours with the --lk-accent and --lk-accent-2 variables
5. Replace the sample names, numbers and quotes with your own
6. Upload the page and the assets folder to your web host. The full guide is in documentation.html