The site in front of your product, for a made-up analytics app you rename in one file: a home page with the product at work, features, a tour, customer quotes, plans and questions; pricing with a full comparison; a changelog; an about page with the team; a contact form that checks itself; and a 404 that helps. Mega menus, a footer with a newsletter, light and dark, favicons and social cards drawn from your name and logo.
Pro6 pagesEnglishLight and dark
Pages
What's inside
- Your brand in one fileThe name, tagline, menus and footer come from lib/site.ts, the plans from lib/plans.ts, the mark from lib/logo-mark.tsx.
- Favicons and social cardsThe favicon, the home-screen icon and a share card for every page, drawn from your name and logo, the changelog's from its newest release.
- Built from blocksEvery section is a Dashral block or a kit Section, so a page is a list you reorder, swap or extend.
- Mega menusProduct and Resources open with icons and descriptions on a computer, and fold into a sheet on phones.
- A contact form that worksChecked on the server with each problem under its field, a busy button while it sends, and a toast when it's through.
- Light and darkFollows the system or the visitor's pick from the footer, with no flash on load.
- Search engines in mindA title and description on every page, a sitemap and robots.txt, and headings in order.
- Every screen sizeEach page restacks for phones; buttons sit side by side and wide tables scroll with a fade.
Next.js 16React 19Tailwind CSS v4TypeScriptRadixnext-themes
Get started
It comes with Dashral Pro. One command makes a Next.js project of its own with only this website, laid out like a new Next.js app, with the blocks it uses copied in and the components from npm; it then opens on localhost:3000. It runs once your GitHub account has access to the Pro repository (your account's Get started says how). No database or keys to set up.
$ pnpm create dashral my-site --pro --template saasIt's also in your Pro repository beside the dashboard, in apps/saas, where pnpm dev runs it on localhost:3003.
Your name, tagline, menus and footer are in lib/site.ts, the plans in lib/plans.ts and the logo in lib/logo-mark.tsx; the favicon and the social cards follow them. Each page is a list of blocks you can reorder, swap or change. To put it online, set NEXT_PUBLIC_SITE_URL to its address and deploy it to Vercel or any Node host.
Then make it yours: change the colors and radius with the theme tokens, add pages from the blocks, and set your logo and domain (the README's Make it yours).