ClayAI is our website template for AI tools and SaaS products, in deep navy with blue accents. It was our first website template, and it covers a full product site: home, features, pricing, blog, contact and a documentation page.

Type: Our website template · Industry: AI, SaaS, productivity tools · What we did: Design and Framer build · Platform: Framer · Launched: July 2024 · Live: clayai.framer.website

ClayAI is made for founders who need a launch-ready product site fast. The sample product promises “Boost your Productivity with Creative AIs” and shows CRM, email campaign, user management and financial planning screens, so many kinds of AI product can fit inside it.

An AI startup needs a site that looks like a real product on day one, before it has much to show.

Buyers must see their product. Generic shapes do not help; the page needs real-looking product screens.

A landing page is not enough. Features, pricing, a blog and docs are all part of a SaaS launch.

Effects cost speed. Motion has to stay smooth on every device.

Founders edit alone. Text, plans and posts must change without a developer.

Hero with “Boost your Productivity with Creative AIs”, two buttons and a “Trusted by” logo row.

Dashboard mockups for CRM design, email campaigns, user management and financial planning, each next to a short feature story.

Scroll-triggered reveals and floating entrances for the mockups.

A features page, “Simplify your Business Growth with ClayAI”, with cards for expense tracking, secure transactions, reports and analytics.

A pricing page with three plans, Starter, Core and Enterprise, each with its own feature list.

Testimonials and an FAQ on both pages.

A CMS blog with three sample posts and article pages.

A documentation page with a sidebar for Quick Start, User Guides and API Reference, plus code blocks and a search field.

Layouts for desktop, tablet and phone.

Free updates for buyers, as the template changes.

Included:

Home, features, pricing, blog, contact and documentation pages, plus privacy and terms

Product UI mockups, a three-plan pricing table, testimonials and FAQ

CMS blog and docs, and layouts for desktop, tablet and phone

Not included:

Custom design for one product: this is a ready-made template

Screens of the buyer's real product: the mockups are samples to swap

A working sign-up, billing or app behind the buttons: this is the marketing site only

Live as a demo at clayai.framer.website.

Listed on the Framer marketplace since July 2024, with free updates for buyers.

Founders can change copy, plans, blog posts and docs in Framer without code.

Add a changelog page in the CMS, so a startup can post product updates.

Add an integrations page with a logo grid and one detail page per integration.

Add a comparison page template, such as “ClayAI vs. others”, for founders who compete on features.

I design websites in Figma and build them in Framer or Webflow, so your team can edit every page without a developer. Message me here on Contra with your site or Figma file, and I'll reply with a plan and a fixed price.