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

NicelyDone UI Kit gives you a comprehensive collection of HTML, CSS, and JS components which are simple to use in Webflow, customizable and extendable. 

It provides a great structure for building websites quickly with a scalable and maintainable foundation. Get the same benefits as BEM, but without any hassle.

NicelyDone UI Kit treats words and classes as the exchangeable concepts. Classes use syntax from natural languages like noun/modifier relationships, word order, and plurality to link concepts intuitively. It comes equipped with an intuitive inheritance system and high level theming variables that let you have complete design freedom.   

Feel free to use it wherever/however you want, no credit needed.

Please give this project a like so others can see it!

UI Kit & Style Guide Template

NicelyDone — UI Kit & Style Guide Template (Copy + Paste)

An idea I had on how to perfect the way we handle notifications on mobile devices.

Have a look and let me know what you think, if we can make it even better.

Feel free to clone.

iOS Notification concept

iOS Notification NEW concept

Today I realized that Internet Explorer really does not display Webflow sites well at all. Even the latest versions of IE totally screw up flex and grid. 

For my sites, I will be adding a notification to users to upgrade to a different browser. It took me a bit to learn how to target all versions of IE, so I thought I would save you all the time by sharing the project and code.

The custom code to target all versions of IE is in the page settings. I would recommend putting it into the project settings, so you only have to add the code once. 

Let me know if you have any issues with this, and I hope it helps!

Chris

Show Internet Explorer Warning

Warning to Internet Explorer Users

Announce company updates, offer special discount coupons or anything else with our free top notification bar Webflow cloneable.

It includes a total of 4 variations, so you can choose the one that best suits your website needs.

- - - - - - - - - -

Interested in this free Webflow Cloneable?

• Check out a live preview on: https://top-bar-cta-cloneable-brixtemplates.webflow.io/

• Click 'Clone project' to get a clone on your Webflow account

• Get the cloneable Figma file to customize the styling and graphics: https://www.figma.com/community/file/1085643893133838442

- - - - - - - - - -

• BRIX Templates - Looking for more Webflow templates? Take a look at our collection of premium & free Webflow Templates on https://brixtemplates.com/

• BRIX Agency - Looking for a hand to design & develop an amazing Webflow website? Get in touch with our amazing team on https://brixagency.com/

16. Top Notification Bar | Webflow Cloneable

Top Notification Bar Webflow Cloneable Template - BRIX Templates

I recreated the Netflix login/homepage! It's complete with interactions, background videos, dropdown menus and notifications divs. Enjoy exploring and feel free to check out the video tutorial on how I made it below:

https://youtu.be/hmjaoeUUJ4w

Netflix Homepage Clone

Landingpage for a notification system which helps people to find the right timing for their activities.

Sino

SINO – Smart and Interactive Notifications

Toast notifications, also known as toasts or snackbar notifications, are a type of UI element that display a brief message or notification to the user at the bottom or top of the screen. Toasts are typically used to provide users with timely information, such as updates on the status of an action they have just performed, or alerts about new content or system events.Toast notifications are commonly used in web and mobile applications. They can be used for a wide range of purposes, such as:
‍
-Alerting users to new messages or notifications
-Confirming that an action has been completed successfully
-Providing users with feedback on the status of a long-running process
-Displaying errors or warnings to users when something goes wrong
-Prompting users to take an action, such as updating their profile


Made by 💪🏻 theThind
https://www.thethind.com

toast

Toast Notification In Webflow

Our local trail committee was looking to send local bikers notifications of trail issues and events. They also wanted users to be able to submit an issue on a trail (like a tree down).

We connected the CMS with Airtable through Whalesync, and the committee could easily manage trail statuses and send notifications through the Airtable app.

Trails App

Trail Status CMS Web App

Vibrand Design

Show CMS based notifications on your Webflow website and if your users have hidden them, only show them again after X days. 

- Dennis from Vibrand Design

++++++++++++++++++++++++
Support our work and get the editable JavaScript Code on Patreon: patreon.com/denniskarg

localStorage Notification Bar

localStorage based Notification Bar

Memberstack

I made a bunch of success and error messages to be used with Memberstack 2.0 😁 When present, these override Memberstack's default success and error messages. 

Design til' your heart's content.

Here's how they work https://docs.memberstack.com/hc/en-us/articles/9951195874587

Success Messages and Error Messages

Happy Tuesday! 🌞 Get ready to level up your Webflow projects with our Medium-inspired notifications page. This project allows your members to easily manage their email preferences.

What's in store for you:
- Custom Checkboxes
- Memberstack integration
- Mailerlite integration
- Tutorial Videos

To help you better understand the project, we've included two tutorial videos on the profile page. The short video gives a high-level overview, while the longer video takes you step-by-step through the process of setting up the project with a mailing service and pushing it live.

Feel free to leave comments on the tutorial videos if you have any questions. Don't forget to like and follow our project for updates! We can't wait to see how you integrate this cloneable email preferences page into your Webflow projects.

Happy building! 😁

-Duncan

Email Settings

Webflow Notification Preferences Page

Webflow University

Join host Nelson Abalos Jr for a Build with me (BWM) session. We’ll learn how to create a custom notification bar that's CMS driven with some low code in Webflow. In this session you’ll learn the basics of Webflow collections, Collection lists, Interactions and adding a cookie to your user’s system.

Build with me #8 - Notification Bar

Here's a demo project on both MemberScripts #20 & #21 - using these scripts, you can achieve the following functionalities:

1. Allow members to like & unlike CMS items
2. Display custom toast/notification boxes

For the tutorials, go to memberstack.com/memberscripts :) Enjoy!

Discover notification websites built by the Webflow community

Discover notification websites built by the Webflow community