AUREL BUILD
EN
Language11
Appearance
Light / Dark
Color style
Menu
ExploreProjectsExpertiseMarketsInsights
CompanyStudioTeamResponsibilityCareers
ConnectProject plannerPartnersLocationsFAQContact
Appearance
Light / Dark
Color style
Start a project ↗

Buyer setup

Edit the system, not every page.

A practical customization path for Next.js buyers. Change the central configuration and global styles, then use the launch dashboard to catch unfinished demo content.

Palette
Mode
Display type
AUREL BUILD

Residential builders · Sample

Built around
your brand.

One global style change updates headings, buttons, surfaces and reusable components.

Start a project ↗

Multilingual system

Eleven languages.
One editable list.

Remove or add locale codes in the central site configuration. Each language pack lives in one file, missing phrases fall back safely to English, and right-to-left layout is applied automatically where required.

ENEnglishLTR
ESEspañolLTR
FRFrançaisLTR
DEDeutschLTR
PTPortuguêsLTR
ITItalianoLTR
中文中文LTR
日本日本語LTR
ARالعربيةRTL
RUРусскийLTR
ΕΛΕλληνικάLTR

Social + project media

Modern channels.
Richer case studies.

The footer includes fifteen familiar social platforms, while every project can independently add video, a 360° tour or an embedded 3D model.

15 social platforms

Keep, remove or add.

Edit the central social.links list. Disable unused networks, paste profile URLs, or enable the included custom-network example with its own short monogram.

Instagram · LinkedIn · YouTube · Houzz
Flexible project media

Use only what the project needs.

Add items to a project’s media list. Hosted MP4 video works directly; Matterport, Kuula, YouTube, Vimeo, Sketchfab and BIM viewers use their embed URL.

VIDEO · 360° TOUR · 3D MODEL · CUSTOM IFRAME

15-minute brand setup

Five changes before content.

  1. 01

    Replace the brand and hero

    Edit app/site-config.ts once to update the company, first-screen message, featured project and primary actions. Keep the included AB mark, hide it with brand.showMark, or replace the paths in app/BrandLogo.tsx with the buyer's own vector logo.

  2. 02

    Choose the colors

    Set theme.palette to aurel, graphite or forest, or use the custom accent picker. Set appearance.controlMode to user, hidden or fixed; then set appearance.fixedMode to light or dark for one permanent visitor-proof style. Button text switches automatically for contrast.

  3. 03

    Choose the type

    Set theme.displayType to serif or sans. Use app/theme.css only for a fully custom system.

  4. 04

    Add verified content

    Replace the included project, service, people, insight and location demo content, then switch its four demoContent flags off.

  5. 05

    Connect and test

    Set the form endpoint and public URL, then complete every item in the launch dashboard below.

Buyer launch dashboard

Know what is real before you publish.

The automatic checks read the central configuration. The final QA checks stay only on this device, so a buyer can leave and continue later.

8%1 / 13 readyDemo safeguards are still active
01

Source + environment

1/9

Brand and first-screen message replaced

Company name, label, hero headline, project caption and primary actions are no longer Aurel demo values.

app/site-config.ts
Needs setup

Contact details are real

All public, team, careers and partner emails plus the telephone number have been replaced.

app/site-config.ts
Needs setup

Address and map are verified

The location labels, map marker and external map URL point to the real business.

demoContent.locationAndMap
Needs setup

Production URL is connected

Metadata, sitemap, canonical social image and robots output use the final HTTPS domain.

NEXT_PUBLIC_SITE_URL
Ready

Contact endpoint is connected

Without this environment value the template intentionally shows a demo response and sends nothing.

NEXT_PUBLIC_CONTACT_FORM_ENDPOINT
Needs setup

Projects and images are owned and accurate

Every fictional project fact, caption, metric and preview image has been replaced or licensed.

demoContent.projectsAndImages
Needs setup

Testimonials and credentials are verified

Client quotes, licences, memberships, safety claims and awards can all be substantiated.

demoContent.testimonialsAndCredentials
Needs setup

Team, services and insights are final

People, roles, service scope, markets, careers and editorial content describe the real company.

demoContent.teamServicesAndInsights
Needs setup

Verified business schema is enabled

Enable structured data only after the name, URL, telephone, address and social profiles are correct.

seo.enableOrganizationSchema
Needs setup
02

Final human review

0/4

Color styles

Six decisions control the palette.

Surface

#F4F0E8

Main page background

Surface Alt

#E7E0D4

Section contrast

Ink

#171816

Text and dark surfaces

Accent

#A54B32

Actions and highlights

Muted

#62625D

Supporting copy

Line

25% Ink

Borders and dividers

Next.js structure

Everything buyers edit often is reusable.

Central configuration

Brand · Hero · Actions · Contacts · Map · SEO schema · Demo-content safeguards

Design tokens

Colors · Type · Spacing · Borders · Surfaces · Motion preferences

React components

Navbar · Mobile quick actions · Site Search · Featured Projects · Filter Bar · Gallery · Project Planner · CTA · Footer · Form

Page content

Projects · Services · Markets · Team · Insights · Careers · Locations · FAQs

Launch protection

Automatic configuration checks · Persistent final QA · Structured-data gate · Honest demo form state

Included with the commercial package

A clearer path from download to a credible live site.

The buyer receives the complete Next.js and TypeScript source, centralized setup, live readiness checks, image guidance, customization notes and deployment instructions.