# gonzalochale/saas-landing-template architecture

> Architecture diagram of the GitHub repository gonzalochale/saas-landing-template, generated by GitDiagram from its file tree, README and a sample of source files (last updated 2026-09-28). It is an AI-made overview: check details against the source.

- Interactive diagram: https://gitdiagram.com/gonzalochale/saas-landing-template
- Repository: https://github.com/gonzalochale/saas-landing-template

## Overview

This is a customizable SaaS marketing landing-page template, not a transactional SaaS application. Visitors arrive at the Next.js home route, browse product messaging and social proof, compare pricing, review FAQs, and reach the footer or navigation links. The README names the principal sections; the sampled route confirms their composition, while several section implementations were not sampled, so their internal behavior is not inferred. The graph focuses on rendering, theme setup, navigation, and the documented content branches.

Main entry points: [`app/page.tsx`](https://github.com/gonzalochale/saas-landing-template/blob/master/app/page.tsx) (Home page), [`app/layout.tsx`](https://github.com/gonzalochale/saas-landing-template/blob/master/app/layout.tsx) (Root layout), [`components/navbar.tsx`](https://github.com/gonzalochale/saas-landing-template/blob/master/components/navbar.tsx) (Navigation bar), [`components/pricing.tsx`](https://github.com/gonzalochale/saas-landing-template/blob/master/components/pricing.tsx) (Pricing section)

## Diagram (Mermaid)

```mermaid
flowchart TD

subgraph group_entry["Page entry"]
  node_layout["Root layout<br/>[layout.tsx]"]
  node_providers["Theme provider<br/>[providers.tsx]"]
  node_home["Home page<br/>[page.tsx]"]
end

subgraph group_site["Site chrome"]
  node_navbar["Navigation bar<br/>[navbar.tsx]"]
  node_theme["Theme switcher<br/>[theme-switcher.tsx]"]
end

subgraph group_content["Marketing content"]
  node_hero["Hero section<br/>[hero.tsx]"]
  node_partners["Partners section<br/>[partners.tsx]"]
  node_stats["Stats section<br/>[stats.tsx]"]
  node_testimonials["Testimonials section<br/>[testimonials.tsx]"]
  node_pricing["Pricing section<br/>[pricing.tsx]"]
  node_faq["FAQ section<br/>[faq.tsx]"]
  node_footer["Footer section<br/>[footer.tsx]"]
end

subgraph group_ui["UI foundation"]
  node_button["Button primitive<br/>[button.tsx]"]
  node_dropdown["Dropdown primitive<br/>[dropdown-menu.tsx]"]
  node_tooltip["Tooltip primitive<br/>[tooltip.tsx]"]
  node_utils["Class utilities<br/>[utils.ts]"]
end

node_visitor(("Site visitor"))
node_theme_service["Theme system"]

node_visitor -->|"opens site"| node_layout
node_layout -->|"wraps content"| node_providers
node_layout -->|"renders navigation"| node_navbar
node_layout -->|"renders route"| node_home
node_providers -->|"configures themes"| node_theme_service
node_navbar -->|"renders switcher"| node_theme
node_navbar -->|"uses controls"| node_button
node_navbar -->|"uses menu"| node_dropdown
node_theme -.->|"selects theme"| node_theme_service
node_home -->|"renders section"| node_hero
node_home -->|"renders section"| node_partners
node_home -->|"renders section"| node_testimonials
node_home -->|"renders section"| node_stats
node_home -->|"renders section"| node_pricing
node_home -->|"renders section"| node_faq
node_home -->|"renders section"| node_footer
node_pricing -->|"uses action"| node_button
node_pricing -->|"styles controls"| node_utils
node_dropdown -->|"styles menu"| node_utils
node_partners -->|"uses labels"| node_tooltip
node_testimonials -->|"uses action"| node_button

click node_layout "https://github.com/gonzalochale/saas-landing-template/blob/master/app/layout.tsx"
click node_providers "https://github.com/gonzalochale/saas-landing-template/blob/master/app/providers.tsx"
click node_home "https://github.com/gonzalochale/saas-landing-template/blob/master/app/page.tsx"
click node_navbar "https://github.com/gonzalochale/saas-landing-template/blob/master/components/navbar.tsx"
click node_theme "https://github.com/gonzalochale/saas-landing-template/blob/master/components/theme-switcher.tsx"
click node_hero "https://github.com/gonzalochale/saas-landing-template/blob/master/components/hero.tsx"
click node_partners "https://github.com/gonzalochale/saas-landing-template/blob/master/components/partners.tsx"
click node_stats "https://github.com/gonzalochale/saas-landing-template/blob/master/components/stats.tsx"
click node_testimonials "https://github.com/gonzalochale/saas-landing-template/blob/master/components/testimonials.tsx"
click node_pricing "https://github.com/gonzalochale/saas-landing-template/blob/master/components/pricing.tsx"
click node_faq "https://github.com/gonzalochale/saas-landing-template/blob/master/components/faq.tsx"
click node_footer "https://github.com/gonzalochale/saas-landing-template/blob/master/components/footer.tsx"
click node_button "https://github.com/gonzalochale/saas-landing-template/blob/master/components/ui/button.tsx"
click node_dropdown "https://github.com/gonzalochale/saas-landing-template/blob/master/components/ui/dropdown-menu.tsx"
click node_tooltip "https://github.com/gonzalochale/saas-landing-template/blob/master/components/ui/tooltip.tsx"
click node_utils "https://github.com/gonzalochale/saas-landing-template/blob/master/lib/utils.ts"

classDef toneNeutral fill:#f8fafc,stroke:#334155,stroke-width:1.5px,color:#0f172a
classDef toneBlue fill:#dbeafe,stroke:#2563eb,stroke-width:1.5px,color:#172554
classDef toneAmber fill:#fef3c7,stroke:#d97706,stroke-width:1.5px,color:#78350f
classDef toneMint fill:#dcfce7,stroke:#16a34a,stroke-width:1.5px,color:#14532d
classDef toneRose fill:#ffe4e6,stroke:#e11d48,stroke-width:1.5px,color:#881337
classDef toneIndigo fill:#e0e7ff,stroke:#4f46e5,stroke-width:1.5px,color:#312e81
classDef toneTeal fill:#ccfbf1,stroke:#0f766e,stroke-width:1.5px,color:#134e4a
class node_layout,node_providers,node_home toneBlue
class node_navbar,node_theme toneAmber
class node_hero,node_partners,node_stats,node_testimonials,node_pricing,node_faq,node_footer toneMint
class node_button,node_dropdown,node_tooltip,node_utils toneRose
class node_visitor,node_theme_service toneIndigo
```

## Components

### Page entry

- [Root layout](https://github.com/gonzalochale/saas-landing-template/blob/master/app/layout.tsx): `app/layout.tsx`
- [Theme provider](https://github.com/gonzalochale/saas-landing-template/blob/master/app/providers.tsx): `app/providers.tsx`
- [Home page](https://github.com/gonzalochale/saas-landing-template/blob/master/app/page.tsx): `app/page.tsx`

### Site chrome

- [Navigation bar](https://github.com/gonzalochale/saas-landing-template/blob/master/components/navbar.tsx): `components/navbar.tsx`
- [Theme switcher](https://github.com/gonzalochale/saas-landing-template/blob/master/components/theme-switcher.tsx): `components/theme-switcher.tsx`

### Marketing content

- [Hero section](https://github.com/gonzalochale/saas-landing-template/blob/master/components/hero.tsx): `components/hero.tsx`
- [Partners section](https://github.com/gonzalochale/saas-landing-template/blob/master/components/partners.tsx): `components/partners.tsx`
- [Stats section](https://github.com/gonzalochale/saas-landing-template/blob/master/components/stats.tsx): `components/stats.tsx`
- [Testimonials section](https://github.com/gonzalochale/saas-landing-template/blob/master/components/testimonials.tsx): `components/testimonials.tsx`
- [Pricing section](https://github.com/gonzalochale/saas-landing-template/blob/master/components/pricing.tsx): `components/pricing.tsx`
- [FAQ section](https://github.com/gonzalochale/saas-landing-template/blob/master/components/faq.tsx): `components/faq.tsx`
- [Footer section](https://github.com/gonzalochale/saas-landing-template/blob/master/components/footer.tsx): `components/footer.tsx`

### UI foundation

- [Button primitive](https://github.com/gonzalochale/saas-landing-template/blob/master/components/ui/button.tsx): `components/ui/button.tsx`
- [Dropdown primitive](https://github.com/gonzalochale/saas-landing-template/blob/master/components/ui/dropdown-menu.tsx): `components/ui/dropdown-menu.tsx`
- [Tooltip primitive](https://github.com/gonzalochale/saas-landing-template/blob/master/components/ui/tooltip.tsx): `components/ui/tooltip.tsx`
- [Class utilities](https://github.com/gonzalochale/saas-landing-template/blob/master/lib/utils.ts): `lib/utils.ts`

### Other components

- **Site visitor**
- **Theme system**

## Connections

- Site visitor → Root layout: opens site
- Root layout → Theme provider: wraps content
- Root layout → Navigation bar: renders navigation
- Root layout → Home page: renders route
- Theme provider → Theme system: configures themes
- Navigation bar → Theme switcher: renders switcher
- Navigation bar → Button primitive: uses controls
- Navigation bar → Dropdown primitive: uses menu
- Theme switcher → Theme system: selects theme
- Home page → Hero section: renders section
- Home page → Partners section: renders section
- Home page → Testimonials section: renders section
- Home page → Stats section: renders section
- Home page → Pricing section: renders section
- Home page → FAQ section: renders section
- Home page → Footer section: renders section
- Pricing section → Button primitive: uses action
- Pricing section → Class utilities: styles controls
- Dropdown primitive → Class utilities: styles menu
- Partners section → Tooltip primitive: uses labels
- Testimonials section → Button primitive: uses action