Skip to main content
Pengrafic Logo

Welcome to Pengrafic

Pengrafic is a free, open-source, premium-quality startup website template built with Next.js 14, TypeScript, and Tailwind CSS. It comes with everything you need to launch a stunning marketing agency, SaaS, or business website.

What is Pengrafic?

Pengrafic is a modern, high-performance landing page template designed specifically for marketing agencies and creative businesses. Built on Next.js 14 with the App Router, it provides a solid foundation for building professional websites with excellent performance and SEO optimization.

Quick Start

Get up and running in under 5 minutes

Components

Explore all available components

Customization

Learn how to customize your site

Deploy

Deploy to production

Key Features

Next.js 14 App Router

Built with the latest Next.js features including Server Components and the App Router

TypeScript Support

Fully typed with TypeScript for better development experience and fewer bugs

Tailwind CSS

Utility-first CSS framework for rapid UI development

Dark Mode

Built-in dark/light mode with next-themes

Framer Motion

Smooth animations and transitions powered by Framer Motion

Supabase Auth

Ready-to-use authentication with Supabase integration

SEO Optimized

Built-in SEO best practices with proper metadata and Open Graph tags

Responsive Design

Mobile-first responsive design that works on all devices

Perfect For

  • Marketing Agencies - Showcase your services and portfolio
  • SaaS Startups - Launch your product landing page quickly
  • Creative Businesses - Display your work beautifully
  • Digital Agencies - Professional website template ready to customize

Tech Stack

Pengrafic is built with modern web technologies:
  • Framework: Next.js 14 with App Router
  • Language: TypeScript
  • Styling: Tailwind CSS
  • Animations: Framer Motion
  • Theme: next-themes for dark mode
  • Authentication: Supabase
  • Icons: react-icons

What’s Included

  • Hero section with video modal
  • Features showcase
  • About sections
  • Testimonials carousel
  • Pricing tables
  • Blog section
  • Contact form
  • Header and Footer
  • Brand showcase
  • Home page
  • About page
  • Blog pages (list, details, sidebar)
  • Contact page
  • Sign in / Sign up pages
  • Error page
  • TypeScript for type safety
  • ESLint configuration
  • Prettier for code formatting
  • Hot reload development server
  • Optimized production builds

License

Pengrafic is 100% free and open-source under the MIT License. Feel free to use it for personal and commercial projects.

Next Steps

1

Installation

Follow the installation guide to set up your development environment
2

Quick Start

Check out the quickstart guide to build your first page
3

Customize

Learn how to customize the theme to match your brand

Build docs developers (and LLMs) love