Website template

Agency

A one page HTML theme for agencies created by Start Bootstrap

Landing Page · Agency · Free

Agency

Pages

Screenshots of the live demo, page by page. Scroll inside a page to see all of it.

/startbootstrap-agency/Agency - Start Bootstrap Theme
Agency website template, /startbootstrap-agency/ page, part 1Agency website template, /startbootstrap-agency/ page, part 2Agency website template, /startbootstrap-agency/ page, part 3Agency website template, /startbootstrap-agency/ page, part 4

Design breakdown

An AI reading of this template's design: colors, type, spacing, sections and signature details. Ottermind starts from it when you use the template.

Overall

landing page, professional, medium density, light/dark contrast

Palette

background #ffffff; surfaces [#f8f9fa, #212529, #ffc800]; text #212529; muted text #6c757d; primary #ffc800; accents []

Type

headings Montserrat, 700, uppercase; body Roboto Slab, 16px; scale h1/h2/h3: 40/40/16px

Shape & spacing

button radius 6px, card radius 50px, no borders, subtle shadows on cards, section spacing 80px, content width 1296px

Sections (top to bottom)
  • Hero — full-width dark overlay on flat-lay product image, centered headline "IT'S NICE TO MEET YOU" in large white uppercase, subheadline in sentence case, yellow CTA button "TELL ME MORE", navigation bar at top with logo and links
  • Services — three-column layout on white background, each column has a yellow circular icon (shopping cart, laptop, lock), bold title below, short paragraph of placeholder text
  • Portfolio — six-item grid of square images with titles and categories beneath, alternating white and light gray backgrounds for rows
  • About — vertical timeline with circular images aligned right, dates and titles left-aligned, connected by thin vertical line, ends with yellow call-to-action circle
  • Team — three-column layout with circular headshots, names in bold, roles in smaller text, social icons below each
  • Clients — horizontal row of brand logos (Microsoft, Google, Facebook, IBM) on light gray background
  • Contact — dark background with world map pattern, form with three input fields (name, email, phone) and one textarea, yellow "SEND MESSAGE" button, footer with copyright, social icons, and legal links
Signature details
  • Yellow circular icons with white line symbols
  • Circular team and timeline profile images with soft drop shadow
  • Flat-lay hero image with overhead product arrangement
  • Vertical timeline with connecting line and final call-to-action circle
  • Consistent use of Roboto Slab for body and Montserrat for headings
  • Dark mode contact section with pixelated world map texture
Other pages
  • /services: not shown
  • /portfolio: not shown
  • /about: not shown
  • /team: not shown
  • /contact: not shown

Template details

Category
Landing Page, Agency
Built with
Bootstrap, HTML5
License
MIT
Author
Start Bootstrap
Price
Free
  • bootstrap
  • bootstrap-4
  • bootstrap-template
  • bootstrap-theme
  • bootstrap4
  • bootstrap5
  • bootstrap5-template
  • css
  • free
  • html
  • open-source
  • theme

Original design by Start Bootstrap, listed on Start Bootstrap. Ottermind does not copy the template's code; it builds a new site from the brief.

The brief Ottermind starts from

It opens in Studio as a draft — add your brand, audience and pages before you send.

Build a landing page website inspired by the "Agency" template. Reference brief: A one page HTML theme for agencies created by Start Bootstrap Style and features to reflect: bootstrap, bootstrap-4, bootstrap-template, bootstrap-theme, bootstrap4, bootstrap5. Use original copy and imagery for my brand rather than the reference's placeholder content.

How to use this template

  1. 1

    Click “Use this template” to open it in Ottermind Studio with its brief filled in.

  2. 2

    Add your brand, audience, pages and content to the brief.

  3. 3

    Ottermind builds a new site inspired by this design — keep editing it in the chat.