Charcoal UI

Gather: Meetup group template

Monthly meetups, sorted.

For meetups and local groups: a countdown hero, the season's schedule, last meetup's photos, a tearable RSVP ticket, a chat FAQ and a contact footer.

About the Gather template

Gather keeps monthly meetups sorted. A countdown hero, the season's schedule, last meetup's photos, a tearable RSVP ticket, a first-timer chat FAQ and a footer for hosts and sponsors.

Monthly meetups, sorted. It is a complete meetup group landing page for React and Tailwind CSS 4, assembled from 7 Charcoal UI sections.

Who Gather is for

  • Design and tech meetups.
  • Book clubs and running groups.
  • Professional networks.
  • Hobby clubs.

What is inside

7 sections, top to bottom:

  • Navbar Floating: A glass pill that hides on scroll down, with a gliding hover highlight and a mobile sheet.
  • Hero Event: Conference hero with a split-flap board of cities and dates, a live countdown and the speaker line-up.
  • Event Schedule: Conference agenda with day tabs, track filters and bookmarks that build your own schedule.
  • Gallery Masonry: Photo gallery with tag filters over a masonry grid and a dialog for the full-size image.
  • CTA Ticket: RSVP block where visitors tear a ticket along its perforation to claim a seat.
  • FAQ Chat: FAQ as a support chat: tap a question and a teammate types the answer back.
  • Footer Contact: Studio footer with a giant email link, address, hours, live local time and a huge faded wordmark.

How it is built

The schedule and RSVP ticket are props. Every section is a separate Charcoal UI section, so you can reorder, remove or restyle any of them, and the accent colour is one CSS variable on the page wrapper.

Install Gather

npx shadcn@latest add @charcoal/gather

Templates are part of Charcoal UI Pro. One seat covers all 100 templates, 107 sections and 300 Pro components. The command installs the page and every section and component it uses, so it runs the moment it lands.

Frequently asked questions

Can I use Gather for a client site?
Yes. A Pro seat covers unlimited personal and commercial projects, client work included.
Is Gather a Next.js template?
It is a React 19 page that works in Next.js (App Router or Pages Router), Vite, Remix and Astro. Drop it into a route and it renders.

Sections in this template

  • Navbar Floating: A glass pill that hides on scroll down, with a gliding hover highlight and a mobile sheet.
  • Hero Event: Conference hero with a split-flap board of cities and dates, a live countdown and the speaker line-up.
  • Event Schedule: Conference agenda with day tabs, track filters and bookmarks that build your own schedule.
  • Gallery Masonry: Photo gallery with tag filters over a masonry grid and a dialog for the full-size image.
  • CTA Ticket: RSVP block where visitors tear a ticket along its perforation to claim a seat.
  • FAQ Chat: FAQ as a support chat: tap a question and a teammate types the answer back.
  • Footer Contact: Studio footer with a giant email link, address, hours, live local time and a huge faded wordmark.

Gather as Markdown