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

Concept page for a bags company. 

If you like this project, please follow my profile! I'll add more free templates.

Bag shop homepage

AOline bags

Moving Background Gradient with dark theme inspired by Webflow Community hero section

Moving Gradient Background

I recently saw the "Unstoppable" site on Awwwards (http://unstoppable.preciosacomponents.com) and of course I wondered if I would be able to recreate it in Webflow. And so I did, but in a Norway theme instead. 🤙

Please let the background video load for a bit, since there's no preloader.

Background video by Pexels.

This Is Norway

This is Norway

We've had a lot of requests for autoscrolling images in background and haven't come across a solution within the Webflow community. Feel free to contribute any suggestions or ideas to improve this feature.

Autoscrolling Images in Background on Infinite Loop

autoscrolling-images-in-background-on-i

Subtle background noise - There are two pages within this project:

1) Custom CSS version
2) 100% Webflow version

Background Noise (CSS)

Background Noise Effect (100% Webflow)

Hi Everyone! Here is an Architecture Magazine layout I built in Webflow to showcase Grid 2.0 and Flexbox. 

The design is by Juraj Masar. Here is his Dribbble page: https://dribbble.com/masar_official

Here is the video tutorial on how I created this layout in Webflow: https://www.youtube.com/watch?v=Oc4HHJ--KHo

WebDev For You - Architecture Magazine Website

Finsweet

Unique background and section break Lottie icons from Lottieflow! Clone the site, watch the walkthrough tutorials, implement cool animations.

Lottieflow Backgrounds Pack

Lottieflow - Backgrounds Pack

Three.js + Vanta.js

  el: "#inner",
  minHeight: 200.00,
  minWidth: 200.00,
  highlightColor: 0xffbb00,
  midtoneColor: 0xff2000,
  blurFactor: 0.5,
  speed: 1,
  zoom: 1


Source:
https://github.com/tengbao/vanta

Informations: 
✅    Good Browser Compatibility
❌    CPU Intensive (Use Only one Vanta.js Animation per Page)
📳    Mostly Good on Mobile

Three.js Colored Fog

Colored Fog Three.js

CodePen implementation that allows the background color to change.

The following are resource links:
CodePen - https://codepen.io/SynCap/pen/zwaZJv
Live site - http://aurora-background.webflow.io/
Share link - https://preview.webflow.com/preview/aurora-background?preview=a199a7b71bd1d541427c630e5f960f23

Aurora Test

Hey NoCoders! 💙

Just a little pre-noCodeConf freebie you can use in your next project. 🎉

It's a nice noise background animation I used in several projects already which is completely done with CSS only.

A quick tip: You can make the noise effect more visible by lighting up the body background color.

If you like this please follow me for more. I will publish a few cloneable projects every week! 💎

Cheers,
Cédric

Noise Effect

Noisy Background Effect

From my Webflow online course community came the wish to build this video player, which basically runs in a loop without sound as a background video. 
If you click on on the unmute button, the video plays from the beginning and the sound is activated.  

We need a bit of custom jQuery code for this. In addition, the Vimeo API must be included if you want to address Vimeo iFrames.

Watch the tutorial here: https://youtu.be/mKFZxHpYGng

Vimeo Background Video with Play Sound Toggle

Motion Hover Effect Background: I tried to replicate the effect using Webflow while trying to achieve something for a client. 
I couldn't pay much attention into this, but I hope it helps someone.
--
♥ What you see? Get even more exclusive content → https://www.patreon.com/flowtreon

Background Grid

background-grid

This is just a fun, simple clone I've built to experiment with some interactions.

It features a hero section that reveals changing images & videos (using CSS). I've written some code that will simulate the cycling effect on Tablet/ Mobile. 

My stretch goal is to refine the "menu interaction" (need to spend a bit more time) and implement a dark mode switch. Rebuilt from https://www.cristobalbalenciagamuseoa.com

Hero Changer

Cycle Images on Hover

A one pager to showcase multiple methods to play with background animations, and try to popularize a design idea for rebooting the Print Button.

You're welcome to clone this site and dig into how it's made.

The Green Print Button

Check this out. Trendy blur gradients using div blocks or SVGs!

Trendy Blur Gradients

New site for my new venture into freelancing! 

Any tips would be great 👌

Joe Lomax - Portfolio 2022

Joe Lomax - Portfolio

Remaking a hotel hero I designed a while ago in Webflow: You can see the original shot here: https://dribbble.com/shots/4819890-Afrika-Lodge

Added some CSS to customize the date picker UI. Feel free to clone and reuse.

Discover background websites built by the Webflow community

Discover background websites built by the Webflow community