Documentation

Splash Lite — free HubSpot drag-and-drop theme

Everything you need to install, edit, and ship a site with Splash — natively in HubSpot's drag-and-drop editor, no code required.

Splash v1.0

Overview

Splash Lite is the free edition of Splash — a fully editable HubSpot CMS theme: 15 drag-and-drop modules, 3 reusable sections, and Home, Landing, and Blank templates plus the full system-page set. It's designed in Lovable and rebuilt natively for HubSpot's editor, so your marketing team edits content and layout without touching code — and without breaking the design.

  • Fields-driven modules with sensible defaults, locked against accidental rebrands.
  • A full design-token system: colors, typography, spacing, radius, buttons, and forms.
  • Bilingual / RTL-ready, reduced-motion safe, and Lighthouse-passing.

Getting started

1. Install the theme

From the HubSpot Marketplace, click Add to account. The theme appears under Design Manager → Themes → Splash.

2. Create a page

Go to Content → Website Pages → Create, choose Splash, then pick a starting template (Home, Landing, or Blank). Give the page a name and a slug.

3. Edit it

Open the page in the editor. Click any module to edit its text, images, and options in the left panel. Drag new modules or whole sections in from the Add menu, and reorder by dragging.

Tip: set colors and fonts once in Theme Settings (below) and every module updates automatically.

Templates

  • Home — a full drag-and-drop homepage (hero, logo strip, stats, credentials, testimonials, value, pipeline, services, case studies, CTA).
  • Landing page — a focused lead-gen layout with room for a form, video, or rich text.
  • Blank — an empty drag-and-drop canvas to compose from scratch.
  • System pages — error (404/500), password prompt, search results, and email subscription pages.

Modules

All 38 modules are available in the editor's Add menu, each with its own icon. Every module reads the global theme tokens, so they stay consistent automatically. Highlights:

  • Hero — headline, intro, two buttons (outline / gold-gradient / solid), trust pills, and an optional background video or connected-systems graphic.
  • Logo slider — continuous marquee with color or grayscale logos and an edge fade.
  • Recognition / stats, Credentials (with icons), Testimonials (grid, slider, or carousel with a group toggle and avatars).
  • Value narrative, Pipeline stepper (numbered circles + connectors), Services grid (with icons), Case studies, and CTA band.

Each module exposes a Background option (Transparent / Warm / Cool / Dark navy) under its Styles tab, so you can build the navy → light → warm rhythm shown in the demo.

Sections

10 pre-composed sections live in the Add section picker (hero, CTA banner, social proof, results band, FAQ + contact, features overview, services showcase, pricing, team intro, and content feature). Drop one into a page and customize it like any module.

Theme settings & tokens

Open Design Manager → Themes → Splash → Edit theme settings (or the Theme tab in the page editor). Changes apply across every module:

  • Colors — primary (navy), secondary (gold), plus background warm/cool tints.
  • Typography — heading and body fonts, sizes, and weights.
  • Spacing, corner radius, buttons, and forms — global control of the look and feel.

Header & footer

The header shows your logo, a navigation menu, and a CTA button. Assign a HubSpot menu under Settings → Navigation; until you do, a sensible fallback nav renders so the page never looks empty.

The footer is a single global module — edit it once (logo, columns, social icons, newsletter, legal) and it updates on every page.

Hero background video

The hero can use a looping background video. Because HubSpot's CLI doesn't ship video as a theme asset, upload your .mp4 to the File Manager and paste its URL into the hero's video field. A poster image shows on mobile, reduced-motion, and data-saver — keeping the page fast.

AI Kit (optional)

The optional Splash AI Kit is a set of Claude + Lovable playbooks and a files library for rebrand sprints — design in Lovable, align to the Splash schema, ship in HubSpot. It's a value-add, never a dependency: Splash is fully editable with native HubSpot tools on its own.

Updates & forking

Editing content, fields, and theme settings is fully update-safe — you'll receive theme updates without losing your work. If you edit the theme's code, that copy becomes a fork and is no longer update-safe. The code ships documented and yours to fork intentionally.

Accessibility & performance

  • Every animation honors prefers-reduced-motion.
  • Built RTL-ready for bilingual sites — same theme, both directions.
  • Marketplace-validated and Lighthouse-passing across templates.

Upgrading to Splash

Splash Lite is the free edition. The full Splash theme adds the complete kit: 38 modules and 10 sections (pricing tables, comparison matrix, calculators, assessments, team, integrations, and more), blog templates, the optional hero background video, and the optional AI Kit. Your content carries over — it's the same module family.

Support

Questions or issues? Reach the IV-Lead team at contact@iv-lead.com. Include your portal ID and the page URL so we can help quickly.