Freeframe
Sign in
App10 pages · 0 downloads · Free

Tessel

A neo-brutalist SaaS website for an online form and survey builder, with a live form builder in the hero.

Stack: HTML + Tailwindv1.0.0 changelog

DocsLive demo Download .zip169 KB

About this template

Tessel is a bold, neo-brutalist marketing site for a fictional form and survey builder from Omaha, Nebraska: cream paper, thick black borders, hard offset shadows and flat tomato, butter, mint and periwinkle blocks. The home page opens on a working mini form builder with a live, validating preview. It also has a features page with a conditional-logic demo and drop-off analytics, a searchable template gallery with preview dialogs and a shortlist, pricing with a response-volume slider and comparison table, an integrations directory, a changelog, customer stories, a sales form and a sign-up and sign-in page.

Features

  • Live hero form builder: add, remove, reorder and rename fields, toggle required, with a preview that validates as you type and is saved in the browser
  • Conditional-logic demo where rules switch on and off and the ticket total updates as answers change
  • Drop-off analytics card with a 7 and 30 day switch that flags the question losing the most people
  • Template gallery with category chips, search, shareable URLs, an empty state, a preview dialog and a saved shortlist
  • Pricing with a monthly / annual switch, a response-volume slider that reprices every plan and picks the best fit, a comparison table and FAQ
  • Searchable integrations directory with category filters and what-syncs details
  • Changelog with type filters and dates that stay current, plus a roadmap and newsletter form
  • Sales form with routing and a reference number, live sales hours in Central Time and the next weekly walkthrough
  • Sign-up and sign-in tabs with password strength, plan and template hand-off, and a password reset
  • Neo-brutalist design with Bowlby One and Ubuntu Sans, hand-drawn SVG art and a dark mode that keeps the thick borders

Pages included

Quick start

unzip tessel.zip && cd tesselopen index.html        # that's it # optional, after adding new Tailwind classes:npm install && npm run build
Read the Tessel documentation →

Changelog

  1. v1.0.0

    Added

    • Initial release with 10 pages: Home, Features, Templates, Pricing, Integrations, Changelog, Customers, Talk to sales, Sign up & sign in, 404.
    • Live hero form builder: add, remove, reorder and rename fields, toggle required, with a preview that validates as you type and is saved in the browser.
    • Conditional-logic demo where rules switch on and off and the ticket total updates as answers change.
    • Drop-off analytics card with a 7 and 30 day switch that flags the question losing the most people.
    • Template gallery with category chips, search, shareable URLs, an empty state, a preview dialog and a saved shortlist.
    • Pricing with a monthly / annual switch, a response-volume slider that reprices every plan and picks the best fit, a comparison table and FAQ.
    • Searchable integrations directory with category filters and what-syncs details.
    • Changelog with type filters and dates that stay current, plus a roadmap and newsletter form.
    • Sales form with routing and a reference number, live sales hours in Central Time and the next weekly walkthrough.
    • Sign-up and sign-in tabs with password strength, plan and template hand-off, and a password reset.
    • Neo-brutalist design with Bowlby One and Ubuntu Sans, hand-drawn SVG art and a dark mode that keeps the thick borders.
    • Full documentation in DOCS.md.

More templates