網站範本

Agency

A one page HTML theme for agencies created by Start Bootstrap

這個範本的介紹目前還沒有繁體中文版本，先以英文顯示。

Landing Page · Agency · 免費

開啟線上示範查看原始碼儲存庫

頁面

線上示範的逐頁截圖，在頁面框內捲動即可查看完整頁面。

Agency 網站範本，/startbootstrap-agency/ 頁面，第 2 部分 — /startbootstrap-agency/Agency - Start Bootstrap Theme

設計解讀

AI 對這套範本設計的解讀：配色、字體、間距、區塊與標誌性細節。使用範本時，Ottermind 會以它為起點。

這份解讀目前還沒有繁體中文版本，先以英文顯示。

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

範本資訊

分類: Landing Page, Agency
技術: Bootstrap, HTML5
授權: MIT
作者: Start Bootstrap
來源: Start Bootstrap
價格: 免費

bootstrap
bootstrap-4
bootstrap-template
bootstrap-theme
bootstrap4
bootstrap5
bootstrap5-template
css
free
html
open-source
theme

原始設計來自 Start Bootstrap，刊登於 Start Bootstrap。Ottermind 不會複製範本程式碼，而是依據需求打造全新的網站。

Ottermind 起步用的需求

它會以草稿形式在 Studio 中開啟，送出前先補充你的品牌、受眾與頁面。

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.