Overview · Docs · PyColors

TemplatesNA-AI Landing

Launch a premium AI landing page fasterLink to section

NA-AI Landing is a polished, production-ready frontend marketing template for:

AI startups
SaaS founders
analytics platforms
agencies
indie makers

It gives you the public product surface first:

premium hero
AI analytics sections
metric visualizations
integrations
pricing
testimonials
FAQ
contact form
dark and light mode
SEO-ready metadata
data-driven content structure

This is not a full SaaS app.

It is a focused landing page foundation designed to help you launch, validate, and present your offer faster.

Launch the marketing layer faster.

NA-AI Landing gives you a premium public product surface without rebuilding a modern frontend marketing foundation from scratch.

View details

One-time payment · Instant access after purchase

Core idea

NA-AI Landing helps you launch the marketing layer. Starter Pro helps you wire the SaaS business layer.

What is includedLink to section

Premium landing page

Hero, feature cards, metrics, integrations, pricing, testimonials, FAQ, CTA, and contact sections.

Modern frontend stack

Next.js 16+ App Router, TypeScript, Tailwind CSS v4, Framer Motion, Recharts, and Lucide icons.

Powered by PyColors

Built with PyColors UI and PyColors Tokens for consistent surfaces, spacing, themes, and reusable primitives.

Data-driven content

Most content is controlled from src/@data so you can customize the page without digging through every component.

Built withLink to section

Layer	Technology
Framework	Next.js 16+ App Router
Language	TypeScript
Styling	Tailwind CSS v4
Design system	PyColors UI
Tokens	PyColors Tokens
UI primitives	Radix UI
Animations	Framer Motion
Charts	Recharts
Icons	Lucide React
Fonts	Plus Jakarta Sans, JetBrains Mono
Theme	next-themes

Important scopeLink to section

NA-AI Landing is a static frontend landing page.

It does not include:

backend
authentication
database
payments
CMS
user dashboard
email delivery

You can connect it to:

Node.js
NestJS
Django
Laravel
Supabase
Firebase
Stripe
any backend or API stack

Scope boundary

NA-AI Landing is the marketing surface. For auth, billing, protected routes, and SaaS app foundations, use Starter Pro.

Data-driven structureLink to section

Most sections are controlled from dedicated content files.

Section	File
Hero	`src/@data/hero.ts`
Features	`src/@data/features.ts`
Integrations	`src/@data/integrations.ts`
Pricing	`src/@data/pricing.ts`
Pricing Table	`src/@data/pricing-table.ts`
Testimonials	`src/@data/customers.ts`
FAQ	`src/@data/faq.ts`
CTA	`src/@data/cta.ts`
Contact	`src/@data/contact.ts`
Footer	`src/@data/footer.ts`
Navbar	`src/@data/navbar.ts`

This structure keeps customization faster and more maintainable.

Instead of editing multiple sections manually, most marketing content can be updated from centralized data files.

Included vs not includedLink to section

Included

full Next.js project structure
premium landing page sections
PyColors UI integration
PyColors Tokens integration
dark and light mode support
Recharts visualizations
SEO metadata configuration
sitemap and robots setup
commercial usage license

Not included

backend API
database schema
authentication system
Stripe payments
user dashboard
CMS integration
email delivery infrastructure

Recommended workflowLink to section

A high-leverage path usually looks like this:

customize branding
update positioning
edit the data files
deploy the landing page
validate demand publicly
connect Starter Free or Starter Pro later if needed

This helps you validate the market before rebuilding infrastructure too early.

Templates are focused intentionally

The goal is not to become a full SaaS product immediately. The goal is to launch a credible public surface faster.

Next stepsLink to section

SetupInstall dependencies, run the template locally, and validate the production build.CustomizationCustomize branding, content, sections, pricing, SEO metadata, and assets.Starter FreeValidate SaaS UX, dashboards, settings, and mocked product flows.Starter ProMove into authentication, billing, protected routes, and backend foundations.