30 Beautiful Examples of Websites Made in Webflow Site Builder (2021)

Webflow is a visual in-browser web design tool that enables users to build websites without any coding using a drag-and-drop interface that will look familiar to Photoshop users. Websites made in Webflow work like any custom-built website and can be created from a pre-existing template or designed from scratch.

Website builders like SquareSpace and Wix are useful for complete beginners but they’re restrictive for people who have the design skills to create a great website but lack the coding skills. Most drag and drop website builders also lack the CMS capabilities of platforms like WordPress. Webflow is an ambitious attempt to bridge the gap between these different tools.

Webflow is a visual tool that produces websites that are properly coded in a way that is clean, fast-loading, and responsive. This is unusual as drag and drop visual site builders are notorious for producing bloated code and websites that are slow to load.

Additionally, Webflow offers hosting for your website including staging areas and SSL so all you need to get your site online is a domain name.

Want to give Webflow a try? You can use the platform for free for as long as you like. You only pay when you’re ready to launch your site. You can sign up here.

The best way to see what’s possible is by looking at some examples of websites built in Webflow. The following 30 websites were specially chosen by us to demonstrate the flexibility, power, and creativity of the Webflow platform.

1. Meter

Webflow is a design tool but it works as well for business website as it does for creative sites. The long scrolling design used by internet company Meter shows off Webflow’s animation effects with a clean, easy to navigate design.

2. Health-Ade

This eye-catching one-page web design is a great example of how to make a landing page in Webflow with impressive animations and visual scrolling effects. The sticky “Shop Now” button ensures the CTA is always visible and links directly to the online store.

3. Emma.ca

Emma is a Canadian life insurance company that uses Webflow to build and host their website in both English and French versions. The site includes a database of baby names built on the Webflow CMS to attract search engine traffic from their main customer base – new and expectant mothers.

4. Craft.do

App startup Craft uses a minimal and modern design with animations to explain their product clearly and draw attention to their CTA (a link to the app store). The main website consists of just two pages, with a getting started guide showing exactly how to use the app.

5. Content Writing Jobs

Content Writing Jobs uses Webflow’s powerful CMS and tech integrations to create a searchable job board and database. Emails and social media posts are automated to reduce maintenance time and the streamlined design combined with advanced filtering options make the site easy to use for job seekers.

6. Unusual Ventures

Venture capital firm Unusual Ventures uses unique illustration and animated effects to stand out from their competitors with a memorable website that also delivers a great user experience.

7. COVID-19 Vaccine Tracker

Since the start of the COVID-19 pandemic, there has been a huge need for people to access information and data in a way that’s clear and easy to understand. The COVID-19 Vaccine Tracker uses scrolling effects and illustrations to create an interactive infographics that visualizes vaccine production driven by data that updates in real time.

8. Hologram.io

Cellular IoT platform Hologram decided to switch from WordPress to Webflow when they redesigned their website for a faster design and development process. The clean and modern web design features animated visuals and an interactive pricing slider.

9. Ollivere

This unique and fun portfolio uses animation scrolling effects in a storytelling format to keep on-page time high and stand out from the competition.

10. Mack & Pouya Photography

Wedding photographer websites often follow a formulaic design, but not this one! Everyone wants their wedding to be unique and by highlighting their quirky brand with this bright and retro design, Mack & Pouya distinguish themselves from other photographers. This site also features an innovative interactive pricing calculator.

11. Webflow in 2020

If you want to get a good overview of what’s possible in Webflow, it’s worth checking out  this 2020 review site by the Webflow team complete with strobing color-changing background, animated graphics, and statistics aplenty.

12. Oreo The Playful Network

At the start of the lockdown due to the COVID-19 pandemic, Oreo launched a parody ad campaign that poked fun at the claims made by telcos. The website, made in Webflow, is effective in reinforcing the Oreo brand and building social traffic with fun games and recipes.

13. The Crown District

The Crown District utilizes full-screen video and animated text blocks to create a website that’s attractive and inviting to explore. The whole website can be opened in Webflow backend so you can see how it’s put together.

14. Michael Kors

Michael Kors is one of several big name brands that is using Webflow for its official website. The site features several styles of image galleries and a full screen video banner.

15. Dwellito

Dwellito is an online marketplace for prefab homes. The site design uses a full-screen image to show off their product, with a clear and simple grid-based layout for browsing and shopping.

16. René Vendeville

The unique design of this site for sport and mental coach René Vendeville uses asymmetrical blocks and text alignment combined with circular images and subtle animations and parallax scrolling effects to create a feeling of fluidity and motion.

17. The Pen Tool

The Pen tool jazzes up a simple and static layout with bold colors and typography, a custom animated cursor, and hover effects. The result is a perfect fit for its target market of creatives.

18. By Alice Lee

Illustrator Alice Lee uses a minimal site design to keep the attention on her whimsical portfolio. A parallax hover effect on the hero image keeps the user’s attention for longer.

19. Emma Rose Photography

This Webflow portfolio design uses layered images and parallax scrolling effects to bring life to the work of photographer Emma Rose. A subtle menu links to informational pages while the portfolio categories are displayed in bold blocks of color.

20. Ujet

Webflow’s animations and scrolling effects are perfect for the website of innovative scooter brand Ujet. Meanwhile, navigation is clear, easy to use, and visible at all times.

21. Kubo Patisserie

Kubo Patisserie uses clean, bright photography and a minimal site design to create an inviting website that showcases the brand’s delicious cakes perfectly. There’s a lot of thought that’s gone into each individual product page on this ecommerce site.

22. The Goonies

This fan site dedicated to the movie The Goonies uses animation and scrolling effects to create a fully immersive experience for the user.

23. Resplendence Design Studio

This website for an interior and graphic design team has a subtle design but uses subtle animations and overlapping elements to great effect. Keeping the color scheme black and white allows the bold images to shine.

24. Call On Courage

Call On Courage is part portfolio, part online store, with a clever use of video to draw attention to different elements. Particularly effective is the “Talk to me” button with a background video of the site owner talking.

25. Digital China

Pushing the boundaries of web design, this mini site advertising a business program at the Utrecht University of Applied Sciences uses video game style illustrations and hover effects to bring fun and interest to the type of information that would normally be displayed in a standard corporate layout.

26. Bobby Rowe

This playful and colorful site loads full-screen sections on loading, making the experience of browsing the site similar to flipping through a magazine. Fun animations and videos also make for a more interactive and engaging experience.

27. Ls Graphics

This digital marketplace for mockups and illustrations uses a clean grid-based design to showcase its products with no distracting animations or scrolling effects.

28. Serve

The website of this print and web design agency uses illustrations with subtle parallax scrolling effects to draw the eye down the page to their featured content. A minimal web design keeps the focus on the work.

29. Disco

Corporate culture platform Disco uses fun illustrations and transition effects to bring life to its website. The reserved blue and white color scheme and no-nonsense layout balance things out so it doesn’t appear immature.

30. Dayflow

The Dayflow website is another example of how Webflow is a perfect match for illustrators and other creatives, giving them the power to create websites that show off their work without needing coding skills.