Discover the best split websites created by professional designers. Get inspired and start planning your perfect split web design today!

Hey everyone ✌️ I sold this project in December 2021. Check it out at goodbooks.io!

I'm working on himalayas.app and untitledui.com

Follow me on Twitter for updates: twitter.com/jordanphughes

–––

📚 Good Books is a curated collection of book recommendations from some of the most successful, influential and interesting people around the world.

This project started about 6-months ago when I started to keep track of all the books that I wanted to read and who recommended them. I then got (a little) obsessed with the project and ended up accumulating over 15,000 book recommendations from about 1,250 people...

I built Good Books to share these book recommendations with the world, organising them into simple categories and industries so it's easy to find your next read.

Cheers 🙂

Good Books

Good Books 📚

A split screen design, where on the left side the text is scrolling and on the right side the project image stays sticky in the viewport and is changing depending on the project teaser and scroll position.

Remember that you have to adjust the interaction as soon as more teasers are added!

Tutorial: https://youtu.be/iJzYIk34qPM

Sticky Project Teaser Image Scroll Animation

This is another of these section scroll projects using Scrollify.js. This time I'm using a split screen design layout with some geometrical tennis court illustrations that I made the other day. I really enjoy the vibe of those.

Feel free to clone this project and use it for something much cooler than this example. 🤙

Another Section Scroll Project

section-scroll-tennis-court

A fun animated header from a personal project I am working on. Not (yet) responsive. 

Its a bit glitchy and works best when you actually open the window as opposed to the little preview but still cool.

Clone and reuse at will.

Arthur

Split Header

Split Animated Header

With the basics from PixelGeek I realized this splitter hero and added black/white fading on mouse over, link-blocks and arrows – ready to clone and use for your next split screen hero.

Splitten hero with mouse over interaction

Clone: Splitten hero with mouse over interaction

'Split' is a One Page Webflow template with a minimal, centrally-divided layout. The template is perfect for a professional online presence featuring a big image of yourself, team or product with alongside content.

Split

Split - One Page Personal Site

Responsive slider splitting vertically, with custom code to change slides by scrolling.

Cloneable :)

Photos credit: https://unsplash.com/@sandrokatalina

Split slider

Vertical Split Slider

Studio Almond

StudioAlmond believes in the power of three: absolute technical leadership, inspired design and a client dedicated to best practice for their business.

Artpress is a Berlin based international PR agency for visual arts, photography, architecture, music and design.

(imagery not finalised, yet)

Artpress

ARTPRESS

Dunclyde

Scotland's Santa Cruz superstore! This site both showcases the Santa Cruz lineup, while also promoting Cyclehighlands as a great local bike store, with knowledgable staff and two fully equipped workshops on site.

Cyclehighlands

This is a high fidelity mockup of a client website I designed.

FanCrater Promotional Site

Discovered my work with this new website.

Mood Studio

🖖 Split bills
🔍 Track expenses
🔧 Manage shared finances.

  https://apple.co/2IszOOL

Luna App

Luna App - Track & split bills

A modern split screen responsive website featuring floral design for weddings and events.

Discover split websites built by the Webflow community

Discover split websites built by the Webflow community