Angled Gallery Hero
+6Skillry Pick
Harbor SaaS Suitev1.0.2
Use this Skill to build website page.
Rising
5.017 downloads0 likes1 saves
$4.99
What do I get when I buy this Skill?A complete SaaS product prototype that reads as one real, finished product: marketing landing page, pricing, sign-in, a working signed-in workspace and an admin back office, plus a customer story, public changelog and legal pages. Every view shares one porcelain-and-teal design and one live demo state, so credits spent or plans changed in one place show up everywhere else. Product windows are drawn in code, and the whole suite has light and dark themes.
Picked most often by
Updated Oct 3, 2026
Similar Skills
View all skills
What you get
- Landing, pricing, sign-in, workspace and admin views, plus customer story, changelog, legal and 404 pages, all routed and sharing one live demo state
- A working workspace for your core object: compose, AI-draft with credits, schedule, manage subscribers and see each action land in the admin activity feed
- Instrument Sans and Geist Mono type, teal pill buttons, soft cards, a command palette, light and dark themes and role-based photos in one offline file
Good fit
- Founders pitching a SaaS idea who need the whole product to feel real before any backend exists
- Product managers running stakeholder or investor walkthroughs across marketing, app and admin
- Indie developers who want one design system across the public site and the signed-in product
Not for
- Production apps with real auth, payments or data; sign-in, checkout and credits are front-end simulations
- Single landing pages; if you only need a marketing page, a landing-page Skill is a better fit
- Loud, colourful consumer brands; harbor is calm and product-led with one teal accent
Product Launch & App GrowthDigital Publications & Web PagesBuild Website PageBuild Landing PageStyle-lockedEditable OutputFast TurnaroundPorcelain TealPill InterfaceSoft Elevated CardsWindow Chrome MockupsLight Dark Ui
About this Skill
Describe your SaaS and get the whole product surface in one go: a marketing site, pricing, sign-in, the workspace where your core object is made, and the back office that watches the business. Every view shares one porcelain-and-teal design and one live demo state, so an action in the app shows up in admin. Everything arrives as one file that opens offline in any browser.
What you get
- A landing page with a product window, how-it-works tabs, a feature bento, a customer story, quotes, FAQ and a sign-up band
- Pricing with a billing switch, plan cards, a credit pack and a comparison table
- A signed-in workspace with drafting, scheduling, subscribers and settings, and an admin view with a revenue chart, range switch and sortable table
- Customer story, public changelog, legal and 404 pages, a command palette, and light and dark themes
- Fonts and photos embedded, so the page makes no network requests
How to use it
- Tell the Skill your product name, what users create in it, three to six features, your pricing shape and the numbers the business watches.
- It renames the workspace, panels and actions after your core object, drafts any missing copy and lists it for you to confirm.
- Open the file, sign in to the demo, run the main action, check the admin view and ask for changes in plain words.
New photos come from your agent's image tool, which may have its own usage charges.
What you need before you start
- You bring
- Product name and its core object, the thing users create or manage · Three to six features, your pricing shape and the three or four numbers the business watches · One customer story, plus real photos if the site shows real people
- Dependencies
- Node.js 18 or newer on your agent's machine, to run the bundled script that builds the single offline file · Internet access while the file is built, so the fonts can be downloaded once and embedded · An image tool in your agent for the sign-in, customer story and portrait photos; optional if you supply your own
- Outside costs
- Photos you do not supply are generated with your agent's own image tool, which may incur that tool's usage charges. Product windows are drawn in code, and the finished file makes no network requests. Viewing the example costs nothing.
- Last tested
- v1.0.2 — Claude Code / Claude Desktop / Cowork / Codex / ChatGPT
User reviews
Loading reviews…