Fin - Heartfelt Aquarium Landing Page Template

Fin is a masonry-style landing page template built for volunteer-run fish rescue and adoption services. It leads with a full-viewport betta macro photograph, then walks visitors through a gallery of adoptable fish cards. Each card carries a rescue name, species, temperament tag, and tank-size minimum. Two conversion paths serve adopters and fish surrenders alike.

by Rocket studio

Quick summary

Fin is a single-page aquarium rescue landing page built around a masonry card gallery and a macro close-up header. It introduces visitors to individual adoptable fish before asking anything of them. The layout balances emotional storytelling with practical adoption details, serving both first-time fish keepers and seasoned aquarium hobbyists.

Who this template is for

This template is designed for volunteer-run fish rescue groups that rehab surrendered bettas, cichlids, and other freshwater species. It suits any small rescue operation that wants to present adoptable animals with warmth and clarity.

  • Aquarium rescue volunteers matching fish with informed adopters
  • Hobbyists running community rehoming networks for surrendered fish
  • Parents or educators using adoption storytelling to teach responsible fishkeeping

What problem this template solves

Most fish rescue pages bury the animals in text-heavy lists or plain tables. Visitors never form a connection before they click away. Fin solves that by leading with personality: a name, a face, and a temperament before any form appears.

  • Visitors abandon pages that list fish without visual or emotional context
  • Surrender inquiries get lost when there is no clear second conversion path
  • Impulse adopters need care requirements front and center to reduce returns

What you get with this template

Fin delivers a complete single-page layout structured around one guiding idea: let the fish do the persuading. Every design decision supports that goal, from the opening header to the adoption inquiry modal.

  • A full-viewport macro betta header with a floating geometric sans headline
  • A staggered masonry card grid with hexagonal and trapezoid soft-polygon frames
  • Full-width interstitial story panels placed between card clusters
  • Individual fish detail modals with care notes, compatibility details, and an adoption inquiry form
  • A sticky navigation bar with a visible "Surrender a Fish" secondary call to action

Feature list

The template's core capabilities are described below. Each feature is drawn directly from the design brief and page structure.

Macro Close-Up Hero Header

The header fills the entire viewport with a single large betta portrait photograph. Iridescent scale detail and a creamy java fern bokeh background create an immediate emotional connection. A geometric sans headline fades in after the first visual beat.

Each card in the staggered grid represents one adoptable fish. Cards display a candid rescue photo, a human-style rescue name such as Gerald or Diane, species label, temperament tag, and a minimum tank-size requirement. Soft-polygon frames give the grid geometric rhythm without rigidity.

Full-Width Interstitial Story Panels

Between card clusters, wide panels tell short rescue micro-stories. Examples include a before-and-after of a neglected oscar and a time-lapse of a quarantine tank clearing up. Adopter quotes are woven in to build trust without a lecture tone.

Fish Detail Modal with Adoption Form

Tapping "Meet This Fish" opens a focused modal for each animal. The modal presents care requirements, compatibility notes, and an adoption inquiry form. The form collects tank size in gallons, current tank inhabitants, and a photo of the applicant's setup.

Dual Conversion Navigation

A sticky navigation bar stays visible as visitors scroll. It carries two clear paths: one for adopters and one for owners who need to surrender a fish. Both calls to action remain accessible without scrolling back to the top.

Playful Geometric Card Frames

Cards use soft hexagonal and trapezoidal polygon shapes instead of plain rectangles. The frames stagger at gentle angles across the masonry grid. Interactive cards and hover states glow with neon tetra blue, making clickable elements easy to spot.

Page sections overview

SectionPurpose
Hero headerOpens with full-viewport betta portrait and floating headline
First card clusterIntroduces first batch of adoptable fish with masonry cards
Interstitial story panelShares a before-and-after rescue micro-story
Second card clusterContinues the adoptable gallery with more fish personalities
Adopter quote panelDisplays a short quote from a past adopter
Third card clusterCloses the gallery with remaining adoptable residents
Sticky navigation barHolds dual calls to action across the full scroll
Fish detail modalShows care details and adoption inquiry form per fish

Design & branding system

The Soft Mist color system draws from a low-tech planted tank at golden hour. Every color decision reinforces calm trust and visual warmth rather than clinical pet-store brightness.

  • Backgrounds use foggy aquarium morning white (#EEF0F2) and pale driftwood tan (#D5C7A3) to keep the atmosphere soft and readable
  • Body type and headings sit in deep planted-tank green (#3B6B5E) for strong contrast against light backgrounds
  • Interactive cards and hover states use neon tetra blue (#5BC0EB) as a focused accent that signals clickability without cluttering the palette

Mobile & speed optimization

The masonry layout is structured to reflow cleanly on smaller screens. Card staggering and polygon frames adapt so the gallery remains legible and visually engaging on mobile viewports.

  • Cards stack into a single or double column on narrow screens without losing their geometric frame styling
  • The sticky navigation stays condensed and thumb-accessible on mobile devices
  • Modal overlays are designed to open in full-screen view on small screens for easy form completion

How this template helps you convert

Fin earns conversions by building attachment before presenting any action. By the time a visitor reaches a call-to-action button, they already care about the animal behind it.

  1. The macro hero photograph creates an immediate personal connection, pulling visitors in before any text asks them to act.
  2. Named fish cards with temperament tags and tank-size minimums pre-qualify adopters naturally, so inquiries arrive with more context and better fit.
  3. The dual sticky navigation keeps both the adoption path and the surrender path visible throughout the scroll, reducing drop-off for either audience.

Other information about this template

Fin is a purpose-built template for the fish rescue and adoption niche. It is part of a broader library of pet and animal service templates built around the Playful Geometric theme and Soft Mist color system.

  • The template style is Masonry/Pinterest, suited to any adoption marketplace displaying multiple individual animals
  • The creative direction follows a Gallery Walk structure, meaning the scroll experience mimics moving through a physical fish room tank by tank
  • The header concept is a Macro Close-Up, a single oversized photograph intended to anchor the emotional tone of the entire page
  • The landing page direction is Marketplace/Multi, supporting two distinct visitor goals within one scrollable page layout
  • This template fits within the Fish and Aquarium Services subcategory and is designed for the Fish and Aquarium Rescue and Adoption niche
Fin - Heartfelt Aquarium Landing Page Template
Fin - Heartfelt Aquarium Landing Page Template
Fin - Heartfelt Aquarium Landing Page Template
Fin - Heartfelt Aquarium Landing Page Template

Theme

Playful Geometric

Creative direction

Gallery Walk

Color system

Soft Mist

Style

Masonry/Pinterest

Direction

Marketplace/Multi

Page Sections

Macro Close-up Hero Header

Masonry Fish Card Gallery

Interstitial Rescue Story Panels

Fish Detail Modal with Adoption Form

Dual Conversion Sticky Navigation

Related questions

Can I add more fish cards to the masonry grid?

Does the adoption inquiry form collect setup photos?

Can the template handle both adoption and surrender inquiries?

Does the template work if I only have a few fish available?

Can I change the colors and typeface to match my rescue group?