Skip to main content

Introduction to FreshJuice DEV

FreshJuice DEV is a modern, clean, and minimalistic HubSpot CMS theme designed specifically for developers. Built with Tailwind CSS and Alpine.js, it offers full flexibility and a clean architecture, making it easy to customize and extend for real-world production use.
FreshJuice DEV is the open-source Community Edition of the FreshJuice theme — designed to give developers a head start on HubSpot CMS theme development.

What is FreshJuice DEV?

While most HubSpot themes are heavy and bloated, FreshJuice DEV is intentionally minimal — it loads only the components you actually need, resulting in a pixel-perfect design and a fast-loading website. This theme helps developers get a head start on HubSpot CMS theme development by providing:
  • A clean, modular architecture
  • Modern development workflow with hot-reload
  • Utility-first CSS with Tailwind CSS
  • Reactive components with Alpine.js
  • Pre-built HubSpot modules and templates

Key Features

Modern Tech Stack

  • Tailwind CSS – Utility-first CSS framework for rapid UI development
  • Alpine.js – Minimal JavaScript framework for declarative interactivity
  • HubSpot CMS CLI – Local development toolkit for HubSpot

Developer-Friendly Workflow

  • Hot-reload development with file watching
  • Automatic build and upload to HubSpot
  • Modern JavaScript bundling with esbuild
  • Clean project structure separating source and compiled files

Rich Module Library

FreshJuice DEV includes 37 pre-built modules out of the box:
  • Layout Modules: Global header, footer, navigation
  • Content Modules: Hero sections, cards, accordions, tabs
  • Blog Modules: Post listings, pagination, author info
  • Interactive Modules: Flip cards, modals, carousels
  • Embed Modules: YouTube (lite), CodePen, GitHub Gist, Google Maps
  • Utility Modules: Buttons, dividers, lists, tables

Template Collection

Ready-to-use page templates for common use cases:
  • Home page
  • About page
  • Blog index and blog post (with sidebar variant)
  • Contact page
  • Pricing page
  • Landing page
  • HubDB integration template

Who Is It For?

HubSpot Developers

Perfect for developers building custom HubSpot CMS websites who want a clean starting point with modern tooling.

Agencies

Ideal for agencies that need a flexible, maintainable theme foundation for client projects.

Freelancers

Great for freelancers who want to deliver professional HubSpot sites quickly without sacrificing code quality.

Product Teams

Suitable for product teams building marketing sites on HubSpot CMS with developer-first workflows.

Project Structure

FreshJuice DEV follows a clear separation between source files and compiled theme files:
source/                   # Theme source files
├── css/                  # Source CSS files (Tailwind CSS)
├── images/               # Source images and assets
└── js/                   # Source JavaScript files

theme/                    # Compiled theme files for HubSpot
├── css/                  # Compiled CSS files
├── images/               # Images and icons
├── js/                   # Compiled JS and vendor scripts
├── macros/               # HubL macros
├── modules/              # HubL modules
├── sections/             # HubL sections
└── templates/            # HubL templates
    ├── layouts/          # Layout templates
    ├── partials/         # Partial templates
    └── system/           # System templates

Version & License

  • Current Version: 3.0.0
  • License: MIT License
  • Repository: GitHub
FreshJuice DEV is open source and free to use. A PRO version with additional modules and templates is available separately.

Next Steps

Quick Start

Get up and running in 5 minutes with our quick start guide.

Installation

Detailed installation instructions and setup guide.

Build docs developers (and LLMs) love