Writing & Content Portfolio Blog Website Template

Byline is a masonry-style landing page template built for solo content writers and bloggers who serve B2B clients. It pairs a manifesto-driven scroll with an animated illustration header, a belief-and-proof tile grid, and a sticky intake form. The Electric Indigo color system and Lens & Frame visual theme make it feel editorial, credible, and unmistakably professional.

by Rocket studio

Quick summary

Byline is a single-page content writer landing page template built on a masonry grid layout. It uses a manifesto scroll structure to move visitors from philosophy to evidence to a partnership decision. The Electric Indigo color system and an animated ink-pen header give it an editorial identity that feels crafted rather than generic.

Who this template is for

This template is designed for independent content writers and editorial freelancers who work with business clients. It speaks directly to the kind of writer who handles multiple content formats, holds a consistent brand voice, and operates as a reliable one-person production team.

  • Freelance content writers pitching SaaS marketing directors and DTC brand founders
  • Independent bloggers offering whitepapers, long-form articles, and email sequences
  • Agency overflow writers looking to attract creative leads with serious volume needs

What problem this template solves

Many skilled writers lose potential clients simply because their portfolio page looks like everyone else's. A generic grid of links does not communicate voice, authority, or process. Byline fixes that by presenting the writer as a strategic partner rather than a commodity vendor.

  • Visitors leave too quickly when a page lacks a clear editorial point of view
  • Prospective clients struggle to self-qualify without understanding content formats and volume fit
  • No clear intake path means serious buyers have no easy way to start a conversation

What you get with this template

Byline delivers a fully structured, single-page layout designed around the complete content writer sales journey. Every section has a purpose, from first impression to final conversion.

  • An animated illustration header featuring a looping ink-pen drawing that frames each sentence inside a Polaroid-style border
  • A masonry tile grid that alternates belief statements with real metric cards and case-study snapshots
  • A sticky bottom bar with a primary call-to-action button and a gated rate card download as a secondary path

Feature list

This template brings together visual, structural, and conversion elements that work as one cohesive system. Each feature below is built directly from the page brief.

Animated Ink-Pen Header

A looping hand-drawn animation sketches a sentence across the full viewport in real time. Each word materializes in a flowing script style before the line frames itself inside a Polaroid-style border. The four-second loop completes before the manifesto headline lands beneath it.

Manifesto Masonry Grid

The page body uses a staggered masonry layout that alternates belief tiles with proof tiles. Belief statements declare a position. Metric cards and case-study snapshots follow each belief to back it up. The variable tile heights keep the eye moving without settling into a predictable rhythm.

Sticky Intake Form Bar

A sticky bottom bar appears after the visitor reaches the third scroll depth. It anchors the primary call-to-action and opens a focused intake form. The form collects company name, content type, monthly volume estimate, and a free-text field labeled "Tell me what you're struggling to say."

Gated Rate Card Download

A secondary conversion path offers a downloadable rate card in exchange for a work email address. This gives serious buyers a tangible next step. It also provides a soft qualification filter, separating committed prospects from casual browsers.

Case Study Snapshot Tiles

Mid-page tiles shift from belief statements to case-study evidence. Each tile is styled like a photograph pinned to a corkboard and can display client logos, word counts, traffic results, and publication names. The visual metaphor reinforces the editorial identity throughout the page.

Electric Indigo Color System

The full palette is built around deep indigo, bright violet, warm parchment, and neon accent lilac. Each color has a designated role: parchment fills content tiles, indigo frames card borders, violet marks tags and pull-quotes, and lilac fires on hover states. The result is a cohesive visual language that feels intentional from top to bottom.

Page sections overview

SectionPurpose
Animated header areaOpens with looping ink-pen illustration and manifesto headline
Belief opener tileDeclares the writer's first editorial position to the visitor
Proof metric cardBacks up the belief with a real-world result or data point
Belief-proof gridContinues alternating philosophy and evidence down the page
Case study snapshotsShifts the page toward client evidence and published results
Rate card downloadOffers a gated PDF to qualify buyers with a work email
Sticky call to action barAnchors the intake form after the third scroll depth
Intake contact formCollects brief details to start a partnership conversation

Design & branding system

The Lens & Frame theme treats every content tile like a framed photograph. The Electric Indigo palette is built for a late-night editorial atmosphere, referencing the glow of a monitor in a quiet room. Every color has a specific, non-interchangeable role within the layout.

  • Deep screen-glow indigo (#4B0082) frames each card like a viewfinder border
  • Bright galvanic violet (#7B2FBE) marks category tags, pull-quotes, and the ink-pen animation lines
  • Warm parchment (#F5F0E8) fills content tile backgrounds to keep reading comfortable
  • Neon accent lilac (#C084FC) activates only on hover states and interactive elements

Mobile & speed optimization

The masonry grid is designed to reflow gracefully across screen sizes so the staggered tile rhythm adapts without losing the editorial feel. The sticky intake bar and secondary download path remain accessible at every breakpoint.

  • Masonry columns reflow to a single-column layout on smaller screens
  • The sticky call to action bar stays fixed at the bottom of the viewport on mobile
  • Animated header elements are scoped to the opening viewport for smooth playback

How this template helps you convert

Byline is structured to build trust progressively before asking for anything. The manifesto format earns credibility first, then presents two distinct conversion paths for different buyer readiness levels.

  1. The belief-then-proof scroll builds genuine confidence before any call-to-action appears, so visitors arrive at the intake form already convinced.
  2. The sticky bar and gated download give both ready buyers and early-stage researchers a relevant next step, capturing contact details at either stage.

Other information about this template

Byline is categorized under Portfolio and Agency templates, specifically within the Writing and Content Portfolio subcategory. It is well-suited to the Content Writer and Blogger niche and carries a strong intersection match for that use case.

  • The template style is Masonry and Pinterest-inspired, making it visually distinct from standard portfolio grids
  • The creative direction is Manifesto, which is an uncommon and memorable framing choice for freelance writer pages
  • The header concept is Animated Illustration, a feature that immediately separates this page from static alternatives
  • The landing page direction is Partnership and B2B, meaning every section is oriented toward starting a professional working relationship rather than showcasing work passively
Writing & Content Portfolio Blog Website Template
Writing & Content Portfolio Blog Website Template
Writing & Content Portfolio Blog Website Template
Writing & Content Portfolio Blog Website Template

Theme

Lens & Frame

Creative direction

Manifesto

Color system

Electric Indigo

Style

Masonry/Pinterest

Direction

Partnership/B2B

Page Sections

Animated Ink-pen Header Illustration

Manifesto-driven Masonry Grid

Sticky Intake Form Bar

Gated Rate Card Download

Electric Indigo Color System

Related questions

What content formats does this template support showcasing?

How does the sticky intake form work?

What is the gated rate card download?

Can I use this template if I write for multiple industries?

Is this template suitable for a writer who is just starting out?