Loading…
Live page · scroll inside
PremiumCopywriter portfolio · light · landing page · gsap · lenis · html
Copydesk
A freelance copywriter's site on warm paper with proofreader's red and edit green: the hero holds a tone desk where a soup company's homepage headline, line and button rewrite themselves word by word in Plain, Bold or Warm (shared words slide into place, cut words lift away, new ones rise in) with notes on what changed. Then three marked-up proof slips where red strikes draw through the old copy and green highlights sweep under the new, six questions, a typeset rate sheet with dotted leaders, a client quote and a red sign-off band.
What's inside
- 01Name barSolid after 80 px.
- 02Statement and tone deskSwitching tone rewrites the client copy word by word: words shared by both versions slide to their new places, dropped words lift and fade, new words rise in; notes cross-fade.
- 03Marked-up editsOn entering, a red strike draws through each cut phrase, then a green highlight sweeps under each new phrase.
- 04Six questionsQuestions rise in turn.
- 05Rate sheetRows rise; leaders draw across.
- 06Client quoteQuote lines rise.
- 07Write to meLines rise.
- 08FooterNone.
Utility pages in the same file: 404 · Style guide · Password · Changelog
How to use it
From prompt to a live page.
- 01Walk the page
The preview is the real template: loader, scene, scroll choreography. Scroll inside it or open it full-screen.
- 02Pick a palette
Token sets re-tint the whole page live, scene included. The prompt carries the one you chose.
- 03Pick your stack
Single HTML, Next.js, React, Vue, Astro, WordPress blocks, Shopify sections or a Webflow build guide.
- 04Copy the prompt
It carries the art direction, the tokens, the motion system and every section's layout, motion and content, in order.
- 05Make it yours, then iterate
Swap copy and images first, keeping the structure. Then refine section by section rather than re-running the whole prompt.
