Home Work
SaaS developmentAI developmentAPI developmentMobile app developmentGoogle Ads managementHeadless ShopifyLaravel developmentNext.js developmentReact developmentTypeScript engineeringUI/UX designSEO & AEOEcommerce development
AI solutionsB2B platformsE-commerceHospitalityLead generationLogisticsEducationProcess automationSaaS platformsStartup MVPReal estateHealthcare
LegalHealthcareReal estateFinanceHospitality
The HagueRotterdamAmsterdamUtrechtEindhovenAlmereBredaArnhemNijmegenTilburgEnschedeGroningenLeidenDelftZoetermeerDen Bosch
Studio
AboutProcessLabBlogContact

Website sections.

Complete blocks to build a page with: navigation, hero, services, pricing, reviews, team, contact, cookie banner and footer. Every example is filled in for a different industry, so you see how it feels with real content instead of filler. Pick what fits for each part and we turn it into one coherent site in your brand.

60 items · Some of these items we built ourselves, some come from open-source libraries with a permissive licence. Every item lists its source and licence.

Centered Big-Type Hero Page sections
Centered Big-Type Hero

Awwwards-style: huge centered display type with monospace frame and kinetic reveal.

eigeneigenCSS + JS
View live
Bento Feature Grid Page sections
Bento Feature Grid

Asymmetric bento layout with dark hero tile, beton tiles and accent card.

eigeneigenCSS only
View live
Prijzen in 3 pakketten Page sections
Prijzen in 3 pakketten

Three pricing plans with highlighted middle tier and monthly/yearly toggle.

eigeneigenCSS + JS
View live
CTA-band + nieuwsbrief Page sections
CTA-band + nieuwsbrief

Dark CTA band with bold statement, dual action and inline newsletter validation.

eigeneigenCSS + JS
View live
Statistiek-band Page sections
Statistiek-band

Wide beton band with four large animating counters and monospace labels.

eigeneigenCSS + JS
View live
Proces / stappen Page sections
Proces / stappen

Four numbered steps with a progress line that grows on scroll.

eigeneigenCSS + JS
View live
FAQ Accordion Page sections
FAQ Accordion

Accessible accordion, single-open, smooth height and accent plus icon.

Hyper UIeigenCSS + JS
View live
Megamenu met uitgelichte case

Navbar where "Services" opens a mega menu (hover or click) with link columns, starting prices and a featured case with image area. For service firms with many services.

eigeneigenCSS + JS
View live
Header die krimpt tot pil NewPage sections
Header die krimpt tot pil

Full header that shrinks into a floating pill with only logo and booking button on scroll. Scroll inside the demo area to see it.

eigeneigenCSS + JS
View live
Volledig menupaneel met index

Menu button opens a full panel with large numbered links, office address and opening hours. For studios that use the menu as a calling card.

eigeneigenCSS + JS
View live
Doorlopende USP-balk NewPage sections
Doorlopende USP-balk

Slim bar with scrolling USPs (shipping, review score, delivery) above a compact shop header. Pauses on hover, static with reduced motion.

eigeneigenCSS + JS
View live
Aankondigingsbalk met live openingsstatus

Bar that uses the real clock (Amsterdam time) to show "Open now until 22:00" or "Open again tomorrow at 11:00", with week overview and dismiss button. For restaurants and shops.

eigeneigenCSS + JS
View live
Subpagina-hero met "In het kort"

Heading left with breadcrumb and actions, right an "At a glance" box with four facts and a review date. Works well for legal and financial explainer pages.

eigeneigenCSS + JS
View live
Blogartikel-kop met auteur NewPage sections
Blogartikel-kop met auteur

Blog article header: category, date, reading time, author with initials avatar, share button and a large image area. For knowledge bases and SME blogs.

eigeneigenCSS + JS
View live
404 met zoekveld en populaire pagina's

Error page that brings visitors back: search field with instant results, the three most visited pages and a back link. Swap the list for your own sitemap.

eigeneigenCSS + JS
View live
404 met branchegrap NewPage sections
404 met branchegrap

Error page with a trade joke ("This page has been demolished") and a CSS illustration of a wall with a hole, barrier and loose bricks, plus suggestions. Shows a 404 can fit the brand.

eigeneigenCSS + JS
View live
Cases masonry met filter NewPage sections
Cases masonry met filter

Projects in a masonry grid with working filter chips per type; on hover the project result figure slides into view.

eigeneigenCSS + JS
View live
Case-index als tabel met preview

Case overview as a clean table (client, year, service, result); on hover an image preview follows the cursor. For studios with many projects.

eigeneigenCSS + JS
View live
Werkgebied-kaart met projectpins

Stylised SVG map of the service area with pins; click a pin and the project appears alongside. For local installers and contractors.

eigeneigenCSS + JS
View live
Team met specialisme en bel-direct

Team cards with name, practice area and a personal "call directly" button per lawyer, so visitors reach the right person straight away.

eigeneigenCSS only
View live
Team-rooster met beschikbaarheid

Team as a weekly schedule showing availability per day; today is highlighted automatically. For practices where patients pick a regular therapist.

eigeneigenCSS + JS
View live
Team als polaroids NewPage sections
Team als polaroids

Team photos as slightly tilted polaroids with a personal line; on hover a photo straightens and comes forward. For small, personal businesses.

eigeneigenCSS only
View live
Familiebedrijf-tijdlijn horizontaal

Horizontally scrollable timeline of years with milestones, a progress bar and arrow buttons. For family businesses showing their history.

eigeneigenCSS + JS
View live
Brief van de oprichter NewPage sections
Brief van de oprichter

About section as a personal letter on paper, with a signature that draws itself when the block scrolls into view. For businesses where the owner is the face.

eigeneigenCSS + JS
View live
Contact met vestiging-tabbladen

Contact form next to tabs per branch with address, phone, opening hours and a map panel; the chosen branch also fills the form. For businesses with several locations.

eigeneigenCSS + JS
View live
Getrapt contactformulier NewPage sections
Getrapt contactformulier

Three-step form: first the type of request (quote, breakdown, question), then the matching fields, then contact details. With progress, client-side validation and a confirmation.

eigeneigenCSS + JS
View live
Contact: nu bereikbaar of morgen

Contact block that shows "Available now" or "Tomorrow from 8:00" based on the clock, with call, WhatsApp and email as three equal options whose expectations adapt to the time.

eigeneigenCSS + JS
View live
Redactionele blog-index NewPage sections
Redactionele blog-index

Blog overview as an editorial list without cards: one featured piece on top, then rows with date, category and reading time. For businesses that actually write.

eigeneigenCSS only
View live
Vacatures als filterbare tabel

Job openings in a table filterable by department and hours, with a salary band per row that shows where each role sits. For employers with many openings.

eigeneigenCSS + JS
View live
Vergelijking: wij, zelf doen, groot bureau

Comparison table "With us / Do it yourself / Large firm" with costs in euros, checks and crosses, and a business-type switch that updates the amounts. For service providers explaining their price.

eigeneigenCSS + JS
View live
Integraties-raster met filter

Grid of integrations as text logos (Exact, Mollie, Moneybird, Google Calendar, WhatsApp and more) with a category filter and search. For software showing what it connects to.

eigeneigenCSS + JS
View live
Hero als krantenvoorpagina NewPage sections
Hero als krantenvoorpagina

Hero styled as a newspaper front page with masthead, date and three articles, for firms that sell expertise.

eigeneigenCSS + JS
View live
Klantquote met resultaatgetal

Large client quote paired with a counting result figure and a before/after mini chart, for case studies.

eigeneigenCSS + JS
View live
Terugbelverzoek met tijdvakken

Call-back form with day and time-slot buttons, an adviser photo panel and the average response time.

eigeneigenCSS + JS
View live
CTA met zin als link NewPage sections
CTA met zin als link

Full-width closing CTA in large type where the sentence itself is the link, with a colour fill and arrow on hover.

eigeneigenCSS only
View live
Prijsschuif met pakketgrenzen

Hours-per-week slider that calculates the monthly price live and shows where a cheaper rate kicks in.

eigeneigenCSS + JS
View live
Pakketten met wel en niet NewPage sections
Pakketten met wel en niet

Three plans listing what is and is not included with ticks and crosses, plus a toggle to show only the differences.

eigeneigenCSS + JS
View live
Menukaart met allergenenfilter

Restaurant menu by course with prices and gluten-free, vegan and nut-free filters that hide unsuitable dishes.

eigeneigenCSS + JS
View live
Openingstijden met feestdagen

Opening hours block that highlights today, shows live open status and lists the next holidays with special hours.

eigeneigenCSS + JS
View live
Behandelingen met vergoeding NewPage sections
Behandelingen met vergoeding

Expandable treatment list with duration, price and a clear reimbursement indicator, for physio and dental practices.

eigeneigenCSS + JS
View live
Sticky mobiele belbalk NewPage sections
Sticky mobiele belbalk

Mobile page demo where a sticky bottom bar with Call, WhatsApp and Quote slides in after a short scroll.

eigeneigenCSS + JS
View live

Seen something you like?

Add it to your selection and send it over. We build your site around it, in your brand.

Get in touch →