Charcoal UI

Copyhouse: Copywriter template

Words that sell, from one writer.

For freelance writers and consultants: an editorial hero, a before-and-after of real copy, a client letter, one simple package, FAQs and a booking calendar.

About the Copyhouse template

Copyhouse sells words. An editorial hero, a before-and-after table of real headlines and buttons, a client's letter, one fixed-price package, FAQs and a booking calendar make a freelance writer look like the obvious hire.

Words that sell, from one writer. It is a complete copywriter landing page for React and Tailwind CSS 4, assembled from 8 Charcoal UI sections.

Who Copyhouse is for

  • Conversion copywriters.
  • Content strategists.
  • Brand and messaging consultants.
  • Freelance writers.

What is inside

8 sections, top to bottom:

  • Navbar Floating: A glass pill that hides on scroll down, with a gliding hover highlight and a mobile sheet.
  • Hero Editorial: A newspaper front page as a hero: masthead, serif headline, drop-cap columns and a captioned photo.
  • Features Versus: Old way versus new way: the same tasks side by side, with a toggle that flips the whole table.
  • Testimonials Letter: A customer's thank-you letter on lined paper with a serif body, a P.S. and a self-drawing signature.
  • Pricing Single: One honest plan: a big price, everything included, and a guarantee.
  • FAQ Split: Heading and contact link on the left, a springy accordion on the right.
  • Contact Booking: Book-a-demo block: pick a day, pick a slot and confirm without leaving the page.
  • Footer Minimal: One quiet row: brand, a few links and the year.

How it is built

The versus table makes the before and after the centrepiece. 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 Copyhouse

npx shadcn@latest add @charcoal/copyhouse

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 Copyhouse for a client site?
Yes. A Pro seat covers unlimited personal and commercial projects, client work included.
Is Copyhouse 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 Editorial: A newspaper front page as a hero: masthead, serif headline, drop-cap columns and a captioned photo.
  • Features Versus: Old way versus new way: the same tasks side by side, with a toggle that flips the whole table.
  • Testimonials Letter: A customer's thank-you letter on lined paper with a serif body, a P.S. and a self-drawing signature.
  • Pricing Single: One honest plan: a big price, everything included, and a guarantee.
  • FAQ Split: Heading and contact link on the left, a springy accordion on the right.
  • Contact Booking: Book-a-demo block: pick a day, pick a slot and confirm without leaving the page.
  • Footer Minimal: One quiet row: brand, a few links and the year.

Copyhouse as Markdown