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

I liked Bertani's horizontal scrolling website so much that I rebuilt it in Webflow.

Almost no custom code was used. I used just a little for insignificant stuff such as hiding the scrolling bars, adding the difference blend mode to the cursor, creating the countdown year effect in the preloader, and adding an outline to the text in the menu.

Clone it and have a look through it.

--

Want to learn how it was created? Subscribe to my YouTube channel (tutorials for this website coming soon) 👉 youtube.com/channel/UCgwvah4M6Anta4_5ACFiuRQ

__

• Do you need web design & development? Get in touch 👉 bjorn-encutescu.webflow.io/

• Follow my daily tips on Instagram 👉instagram.com/bjorn_encutescu/

Bertani Webflow Rebuild

Bertani Webflow Rebuild - Horizontal Scrolling Website

New year! New website!
Today I am sharing with you my new studio website!
Building everything from scratch is always a big challenge.
I still have to polish some things, but I hope you like it.
Stay tuned for future upgrades!
Carefully #MadeInWebflow

Antonio's Amazing Experimental Project

Let Your Brand stand out from the crowd.

Scroll and Rotate for Portfolio Page with Outline Text. 
We started building this for a client and then took a different approach. 
If you add the images with hover in view effects, it could look pretty cool. 
Clone and enjoy. 
Any questions, just ask.

wwwwweeeeeeeeeeeeee

99% Webflow 
1% Custom CSS


.without-fill {
  -webkit-text-fill-color: transparent;
  -webkit-text-stroke: 1px #000;
}

text outline animation

Text Stroke Animation

Simple little accordions with a nice easing and icon.

Accordion 2

Outline Accordions

I hate spam calls so I ask all my site visitors to text me first (on my Google Voice number) but I wanted it to be easy for them. So one line of code later and you  make a custom button open the user's default messaging app.

Click To SMS Text Button

Minim Click To Text

I always wanted to explore some components that aren't natively possible with Webflow or require bit more workaround. 

So, exploring this as part of #noco30d challenge by Nocoloco. Here's a responsive US Map with addresses positioned visually, for those who find building simple visual maps daunting in Webflow. :)

- Arjun (@arjunphlox on twitter)

Componento 005

Componento-005: Addresses on Map

An unexpected interaction on a seemingly simple text based button.

012 Button

An annual collection of my favorite records of the year.

Favorite Albums 2018

A very large navigation that you can't miss. It has a neat fill and offset on hover. 

Plus there's little code in the last one to allow people to text you when they click it.

Massive Footer Nav

Minim's Massive Footer Nav

Apply amazing clipping or outline effects on your texts.

Outline Text Cloneable

Outline Text

Favorite Albums 2017

Finsweet

Client-first Live build 3 is The Outline homepage. This is a learning resource released alongside our Client-first Style System for Webflow, a naming convention for every person, for every project.

The Outline homepage was built live on YouTube, using the Client-first Webflow Style System. All live stream projects are released as Webflow cloneables to help the community better understand Client-first! 

Disclaimer: Finsweet does not own any assets of this project. Please do not use the assets, designs, and copy for any of your personal & commercial projects. This cloneable project should only be used for Client-first education!

More info: https://www.finsweet.com/client-first/live-build/3

What is Client-first? https://www.finsweet.com/client-first
Full docs: https://www.finsweet.com/client-first/docs/intro

Made with 💪 by Finsweet