A CREATIVE MARKETPLACE TEMPLATE

Documentation,
beautifully simple.

Everything you need to explore, customize and prepare the Promplume HTML edition for your customers.

1. Getting started

Unzip the package and open index.html in a browser. All CSS, JavaScript and artwork needed for the interface are included locally. Google Fonts are optional and the template has system fallbacks.

For stable localStorage behavior across multiple pages and browsers, we recommend a local static server:

cd promplume-html
python -m http.server 8000

Visit http://localhost:8000. No build process or database is needed for the HTML edition.

2. Page groups

The package includes 66 HTML files: 31 public-facing pages, 8 buyer pages, 12 seller studio pages, and 15 admin console pages.

3. Test the functional demo

Browse and save

From Explore, search titles and tags, filter by model/category/price, sort products, add an item to the bag, or save a wishlist item. Use Ctrl+K / Cmd+K for quick search.

Checkout

Add an item to the bag, open the cart and proceed through the clearly labeled demo checkout. It creates a local example order and adds products to the buyer library. No money is charged and payment details are not collected.

Seller publishing / admin moderation

Go to Create prompt, complete the wizard, and submit. Then open the Admin review queue to approve the local listing. It becomes visible on the storefront after approval, in the same browser. Rejected listings can be edited and resubmitted.

Other UI behavior

Try wishlists, theme switching, newsletter local-save, contact local-save, CSV export, copyable sample prompts, seller profile editing, sample coupons, custom categories, and browser-data reset.

No real authentication: the sign-in form simply routes to a demo workspace. No real accounts, permission boundaries, email sending, AI API calls, downloads of purchased digital products or payments are implemented.

4. Brand system

Brand: Promplume — a creative name inspired by prompts and the tradition of writing with a plume. Tagline: Good ideas deserve great tools.

Typography: DM Sans for body and interface, Instrument Serif for editorial headings, both served via Google Fonts when internet is available. System fallbacks work offline.

Theme: default editorial light, atmospheric dark homepage, and a browser-local theme toggle on public pages.

5. Customize content and assets

  • assets/css/style.css → color variables, layouts, responsive components
  • assets/js/data.js → example categories, creators, products, bundles and journal articles
  • assets/js/app.js → shared page rendering and demo interactions
  • assets/images/brand-mark.svg → original brand symbol
  • assets/images/orb.svg → iridescent hero art
  • assets/images/prompts/ → 16 local original illustrated product covers

A product record uses a unique ID, title, model, category, price, image name, creator ID, sample prompt, and included-items array. Consult existing records for the exact structure.

Each page has its own <title> and meta description. Update those when changing your product positioning.

6. Tailwind v4 and CSS

Promplume includes a small precompiled Tailwind utility layer and a bespoke design system in the main stylesheet. The HTML runs immediately without development tools.

npm install
npm run css:build

This regenerates assets/css/tailwind-utilities.css from source/tailwind.input.css. Editing the custom CSS in assets/css/style.css requires no build step.

7. Deploy the demo

Upload the complete folder contents to any static server, CDN-backed hosting, cPanel or Plesk website root. Keep relative asset paths intact. Share the hosted preview with potential customers, but do not advertise demo checkout as real commerce.

For reliable SEO, localization and server-side protected routes in a production marketplace, use a backend with an appropriate framework rather than relying on static client-side rendering.

8. Production requirements

This product is a frontend template, not a production multi-vendor marketplace. Before using it with real customers, add backend auth + roles/permissions, CSRF/security protections, Stripe or other compliant payment integration, secure digital delivery, seller onboarding, commission and payout accounting, moderation, database migrations, transactional email, legal policies, consent and regulatory compliance, accessibility testing and server-side validation.

The figures, seller identities, ratings, reviews and creator histories are fictional. All policies are placeholders and need legal review.

9. Licensing / assets

Brandmark, hero art and 16 SVG cover illustrations were created specifically for this template and are bundled locally. No third-party stock photos or proprietary model logos are included. The optional font CSS connects to Google Fonts but no font binaries are distributed. See ASSET-NOTES.txt.

Before using the Promplume name for a real business, conduct proper trademark and domain clearance.

Promplume · HTML template documentation · November 2026