網站範本

NexaCore

Light enterprise-infrastructure landing page: a floating pill navbar that shrinks on scroll, a full-screen video hero, a dark service-card grid that unfolds on hover, a chaos-versus-control split around a circular streaming video, and a four-pillar delivery staircase.

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

Landing Page · SaaS · 免費

頁面

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

/embed/templates/nexacoreNexaCore preview - Hirael
NexaCore 網站範本,/embed/templates/nexacore 頁面,第 1 部分NexaCore 網站範本,/embed/templates/nexacore 頁面,第 2 部分

設計解讀

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

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

Overall

enterprise SaaS landing page, futuristic and authoritative, medium density, dark

Palette

background #0d1117; surfaces [#ffffff, #000000, #0a0514, #1c4eff]; text #ffffff; muted text #83799e; primary #1c4eff; accents [#1a0b54]

Type

headings Plus Jakarta Sans, 500, sentence-case; body Plus Jakarta Sans, 17px; scale h1/h2 56px, h3 24px

Shape & spacing

button radius 8px, card radius 36px, no borders, subtle drop shadows, section spacing 120px, content width 864px

Sections (top to bottom)
  • Navbar — floating pill-shaped bar with logo, nav links, search icon, and blue "Contact" button; shrinks on scroll; dark background with white text
  • Hero — full-screen gradient background with radial light burst; centered headline, subheadline, and tagline; dark overlay for contrast
  • Value proposition — centered text block with gradient-colored phrase "from groundbreak to go-live"; four dark cards below with icons, titles, and bullet points; hover reveals expanded content
  • Chaos vs Control — split layout with left-side red Xs and right-side green checks; central circular animated graphic with glowing grid; white background
  • Delivery pillars — horizontal flow with five labeled columns ("Scopes", "Integrates", etc.) connected by wavy lines; gradient wave at base; white background
Signature details
  • Floating navbar that collapses on scroll
  • Full-screen hero with dynamic radial light effect
  • Dark service cards with hover-triggered expansion
  • Central circular animated graphic in chaos-control section
  • Gradient wave connecting delivery pillars
  • Consistent use of purple-to-orange gradients in key text and visuals
Other pages
  • /what-we-build: service-focused layout with similar card grid
  • /our-method: step-by-step process with illustrated timeline
  • /who-we-are: team section with portrait grid and bios
  • /thinking: blog-style article list with featured image thumbnails

範本資訊

分類
Landing Page, SaaS
作者
mohammadshehadeh
來源
21st.dev
價格
免費
  • Landing Page
  • SaaS

原始設計來自 mohammadshehadeh,刊登於 21st.dev。Ottermind 不會複製範本程式碼,而是依據需求打造全新的網站。

Ottermind 起步用的需求

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

Build a landing page website inspired by the "NexaCore" template. Reference brief: Light enterprise-infrastructure landing page: a floating pill navbar that shrinks on scroll, a full-screen video hero, a dark service-card grid that unfolds on hover, a chaos-versus-control split around a circular streaming video, and a four-pillar delivery staircase. Use original copy and imagery for my brand rather than the reference's placeholder content.

如何使用這個範本

  1. 1

    點擊「使用這個範本」,在 Ottermind Studio 中開啟並自動填入需求。

  2. 2

    在需求中補充你的品牌、受眾、頁面與內容。

  3. 3

    Ottermind 以這套設計為靈感打造全新網站,你可以在對話中繼續修改。