Sustainable Cleaning Products for a Clean Home
Effective, environmentally friendly cleaning concentrates delivered to your door in plastic-free packaging.
Trusted by 5,000+ eco-conscious customers
Eco-Friendly Cleaning
Our sustainable cleaning products eliminate single-use plastics and reduce your environmental footprint
Premium personal care, simplified
Our products combine quality ingredients with sustainable design to create a better personal care experience.
Premium Formulations
Each product is formulated with high-quality, natural ingredients that are gentle yet effective for daily use.
- Plant-based ingredients
- Alcohol-free
- No harsh chemicals
Refillable System
Our innovative refill system means less waste and more savings. Simply reorder the refills when you need them.
- Durable containers
- Easy-to-use refill pouches
- Reduces plastic waste by 70%
Sustainable Packaging
All our packaging is designed with the planet in mind, using recyclable and compostable materials.
- Recyclable containers
- Compostable shipping materials
- Carbon-neutral shipping
Cruelty-Free
We never test on animals and ensure our suppliers follow the same standards throughout our supply chain.
- Leaping Bunny certified
- Vegan friendly
- Ethical ingredient sourcing
Flexible Subscription
Create your own delivery schedule that works for you. Easily modify, pause, or cancel your subscription anytime.
- Customizable delivery frequency
- Easy to manage online
- No commitment required
Cost Effective
Our refill system saves you money over time while providing premium quality products at a fair price.
- Save up to 30% with refills
- Subscription discounts
- Free shipping on orders over $35
Start building websites people remember.
Built by two award-winning creative developers, our vault gives you access to the techniques, components, code, and tools behind our projects.
Better for you, better for the planet
Our refillable system reduces plastic waste while delivering premium personal care products directly to your door.
70% Less Plastic
Our refill system dramatically reduces plastic consumption compared to traditional personal care products, helping you minimize your environmental footprint.
Carbon Neutral Shipping
Every shipment is carbon offset to ensure your deliveries have a net-zero impact on the environment, without any extra cost to you.
Natural Ingredients
We formulate with plant-based, biodegradable ingredients that are gentle on your skin and on the environment when they wash down the drain.
Product visualization placeholder
Saves Time
Never run out of your essentials. Your products arrive automatically on your schedule, so you don't have to remember to reorder.
Saves Money
Our refill pouches cost up to 30% less than buying new containers each time, plus subscribers enjoy additional discounts.
Saves the Planet
Every refill you use helps reduce plastic waste and carbon emissions, making a real difference for our environment.
The Numbers Speak for Themselves
Join thousands of customers who are reducing their plastic waste while enjoying premium personal care products.
Get StartedThe platform we wish we had, so we built it for you
Built by two award-winning creative developers, our vault gives you access to the techniques, components, code, and tools behind our projects. Build, tweak, and make them your own.
Interactive Components
Access ready-to-use components like magnetic buttons, emoji rain effects, and directional hover states that bring your website to life with engaging interactions.
Organized Vault
Browse our extensive collection of components, animations, and code snippets, all organized into clear categories with quick-find search functionality.
Creative Animation Effects
Enhance your website with attention-grabbing animation effects that add personality and create memorable user experiences.
Advanced Form Techniques
Implement sophisticated form validation and user interaction patterns that improve conversions while providing a smooth user experience.
Text Animation Effects
Create dynamic text effects like scramble animations that trigger on load, scroll, or hover to make your content engaging and interactive.
Cursor Effects
Add visual flair with cursor-based interactions like image trails and hover states that respond to user movements for an immersive experience.
The creative toolkit behind award-winning websites
Unlock a comprehensive set of components, animations, and techniques that will elevate your web projects and help you create memorable experiences.
Ready-to-use Components
Let's be real—rebuilding a slider (or any core component) from scratch for every project is just annoying. We've set up clean, customizable structures, built with best practices, so you can skip the boring setup and jump straight to the fun stuff.
Educational Content
Drag-and-drop tools might get you a quick animation, but if we're realistic—that won't win awards. We want you to actually understand what you're doing, how it works, and how to nail it yourself next time. Learn the principles, build the skills, and take control of your projects.
Frequent Updates
We are constantly adding new video content, components, and techniques to keep you at the cutting edge of web design. As we create new award-winning websites, we'll share the secrets and code that make them special.
Osmo Basics
Discover the core functionalities and techniques that form the backbone of many websites. These are the foundations you'll rely on for every award-worthy project. Master the basics, and the flashy stuff will actually have something solid to stand on.
- Basic Modal Setup
- Live Form Validation
- Check Section Theme on Scroll
- Detect Scrolling Direction
Code Snippets
Not sure about you, but we find ourselves going back to old projects all the time to quickly copy that snippet we used before. So we decided to keep track of them from now on. Try the below snippet in your project, it's on the house.
Explore All Snippetsdocument.addEventListener("DOMContentLoaded", () => {
// Dynamic update current year
const currentYear = new Date().getFullYear();
const currentYearElements = document.querySelectorAll('[data-current-year]');
currentYearElements.forEach(currentYearElement => {
currentYearElement.textContent = currentYear;
});
});
SVG Icons
Did the designer use PNGs again? We've got you covered. Icons are a must for almost every website, but finding them in the right SVG format can be a pain. That's why we've made it simple: clean, scalable icons you can copy or download in seconds.
And more is coming...
Our Products
Premium personal care, simplified with our refillable system. Choose your starter kit and refill as needed.
Hand Soap Kit
Gentle, effective hand soap in a reusable glass dispenser.
Body Wash Kit
Moisturizing body wash in a durable, refillable container.
Complete Home Set
All your bathroom essentials in refillable containers.
Save with subscriptions
Get 15% off every order and never run out of your essentials. Free shipping on all subscription orders, plus you can modify, pause, or cancel anytime.
- 15% off every order
- Free shipping on all subscription orders
- Flexible delivery schedule (30, 60, or 90 days)
- Modify, pause, or cancel anytime
Save up to $50/year
We've packed our best into one platform
Being sustainable means not reinventing the wheel for every project. We've created Osmo to help developers build more efficiently while still creating websites that stand out and make a lasting impression.
Save Time
Stop building basic components from scratch for every project. Use our ready-made, optimized solutions.
Reduce Digital Waste
Our components are optimized for performance, reducing unnecessary code and improving page loading times.
Focus on Innovation
Spend less time on basic development tasks and more time on creating unique experiences for your clients.
Auto Image Cycle
Automatically cycle through images with smooth transitions without building from scratch.
Directional Button
Create engaging button interactions that respond to mouse movement direction.
Cursor Draw
Add interactive drawing features that follow cursor movements for unique experiences.
Emoji Rain Effect
Create fun, engaging animations that add personality to your websites.
Start building websites people can't ignore
With Osmo, you'll have all the tools and resources you need to create memorable websites that stand out from the crowd and make a lasting impression.
Our Sustainable Approach
By providing optimized, reusable components and educational resources, we help developers:
- Reduce development time by up to 70%
- Create more efficient, performance-optimized websites
- Focus on creating unique user experiences instead of rebuilding common elements
- Build accessible websites that work for everyone
Dennis Snellenberg
Co-founder, Creative Developer
"This whole thing is being built to help developers work smarter, not harder. We've spent years perfecting these techniques, and now we want to share them with the community to elevate the standard of web development everywhere."
Ilja van Eck
Co-founder, Creative Developer
"With a combined total of 24 Site of the Day awards on Awwwards, we've learned what makes websites stand out. Osmo is our way of helping others achieve that same level of recognition and quality."
What our customers say
Join thousands of happy customers who have made the switch to sustainable personal care.
Happy customers
Average rating
Would recommend to a friend
Explore the perks of being a member
Our platform is designed to make your development workflow more efficient and your websites more memorable. Here's how it all works.
The Vault
The Vault is where everything lives. Organized into clear categories, it's designed to make browsing easy. Whether you're looking for a specific slider, animation, or utility, our quick-find search has you covered. With fuzzy search that catches typos, you'll get exactly what you need. Fast, organized, and ready to explore.
Documentation
Every asset comes with clear documentation, clean code, and comments where needed—designed for both Webflow and non-Webflow users. We even remember your preference, so you'll always see the approach that works best for you, first. We also include videos that explain the concept, go deeper on the subject, or might spark some new ideas.
Community
The word 'community' gets thrown around a lot these days, but we genuinely believe it's the best way to connect with other creators. Whether it's solving tricky problems together, sharing ideas, or just finding people who get what you're trying to build, this is where those connections happen. We're on Slack, so no need to go to some dedicated tool online that you'll forget about.
Detail pages you'll love, we hope
Every detail page is thoughtfully designed to provide all the information you need at a glance. From code snippets to implementation guidelines, we've got you covered.
- Clean, well-commented code for easy understanding
- Video walkthroughs for visual learners
- Implementation options for both Webflow and custom code
- Customization options to make each component your own
Magnetic Button
document.addEventListener('DOMContentLoaded', function() {
const button = document.querySelector('.magnetic-button');
button.addEventListener('mousemove', function(e) {
const rect = this.getBoundingClientRect();
const x = e.clientX - rect.left - rect.width / 2;
const y = e.clientY - rect.top - rect.height / 2;
this.style.transform = `translate(${x * 0.2}px, ${y * 0.2}px)`;
});
button.addEventListener('mouseleave', function() {
this.style.transform = 'translate(0, 0)';
});
});
Yeah we know it's a buzzword
The word 'community' gets thrown around a lot these days, but we genuinely believe it's the best way to connect with other creators. Whether it's solving tricky problems together, sharing ideas, or just finding people who get what you're trying to build, this is where those connections happen.
Join 50+ creative developers and designers already sharing ideas and solving problems together in our Slack community.
Hey everyone! I'm trying to implement the magnetic button effect but I'm having issues with mobile. Any suggestions?
@erwin You might want to disable the effect on touch devices. I can share my code that handles that!
I just added a new tutorial about this exact issue! Check the vault, under "Mobile optimization"
Frequently Asked Questions
Everything you need to know about our products and subscription service.
Still have questions?
Contact UsGet In Touch
Have questions or feedback? We'd love to hear from you.
Start Your Sustainable Cleaning Journey
Ready to make the switch to eco-friendly cleaning? Fill out the form and we'll help you get started with the perfect products for your home.
Email Us
support@osmo.supplyCall Us
+1 (800) 555-1234Live Chat
Available Monday-Friday, 9am-5pm EST
Send Us a Message
Frequently Asked Contact Questions
Find quick answers to common inquiries about reaching our team
What is your response time?
We typically respond to all inquiries within 24 hours during business days. For urgent matters, please call our customer service line.
How do I change my subscription?
Log into your account to manage your subscription or contact our support team directly and we'll help you make any adjustments needed.
Do you offer wholesale options?
Yes, we work with businesses and retailers. Select "Wholesale Partnership" in the form subject to discuss bulk pricing and partnership opportunities.
Trusted by professionals
Osmo is loved by creative developers worldwide who use it to build stunning websites faster.
Nicola Romei
Digital Designer
Osmo combines high-quality resources with intuitive guides, making the process of designing standout websites faster and easier, helping creatives to achieve great results in less time.
Jason Harvey
Somefolk
Osmo is full of awesome (and easy to use) interactions that save so much time. They're visually powerful but also robust, and the best thing is, it's only going to get better as more even resources get added!
Flayks
Designer & Front end Dev
It's nice to get access to some creative dev best kept secrets - they're a great a source of inspiration for animations and interactions. Already found out some tricks for some issues that were giving me headaches before!
Huy (by Huy)
Web Designer & Youtube creator
One of a kind platform for any developers out there. It's incredible to be able to see and learn how the pros implement their animations. If you love web animations and creative development, this platform this a no brainer.
Cassie Evans
Developer Education - GSAP
Even if you know GSAP, it can be tricky to apply abstract animation concepts to real-world scenarios. Dennis and Ilja have come to the rescue with this treasure-trove of useful techniques. This gets the official GSAP stamp of approval.
Jesper Landberg
Creative Developer
Osmo Supply is a gem for clever and well-thought-out code/no-code solutions for animations and components. "Even I" came across a few neat tricks I hadn't seen before. Lama stamp of approval on this one!
Jordan Gilroy
Web Designer
The creative developer's cheat code. Osmo is a one-stop shop, offering everything from snippets to help you set up your site to advanced animations and interactions that elevate it to the next level.
Erwin Luijendijk
Cut the Code
The Osmo Vault is a must-have for freelancers and agencies. It saves you a tremendous amount of time, delivers exceptional quality, and enhances creativity in your projects.
Bimo Tri
Webflow Developer
Flawless UI—detailed, easy to implement, and straight-up reliable. The code is clean, well-explained, and ready to drop into Webflow without a hitch. You can tell it's built by pros.
Frequently Asked Questions
Everything you need to know about Osmo before joining
Still have questions?
Contact usAbout the Founders
This whole thing is being built by Dennis Snellenberg and Ilja van Eck. With a combined total of 24 Site of the Day awards on Awwwards, we have years of experience in designing and developing interactive, animated websites that deliver unique user experiences. Now, bringing that experience and expertise to Osmo.
Osmo came from constantly digging through old projects wondering, 'How did I build that again?' It is basically our personal toolbox, packed with components, techniques, tricks and tutorials—and it will keep growing.
We built Osmo to help creative developers work smarter, faster, and better. The platform we wish we had, so we built it for you.
Dennis Snellenberg
Creative Developer
Ilja van Eck
Creative Developer
The creative toolkit behind award-winning websites
Ready-to-use Components
Let's be real—rebuilding a slider (or any core component) from scratch for every project is just annoying. We've set up clean, customizable structures, built with best practices, so you can skip the boring setup and jump straight to the fun stuff. Secretly, we might have made this mainly for ourselves too...
Educational Content
Drag-and-drop tools might get you a quick animation, but if we're realistic—that won't win awards. We want you to actually understand what you're doing, how it works, and how to nail it yourself next time. Learn the principles, build the skills, and take control of your projects.
Frequent Updates
We are constantly adding new video content, components, and resources to the platform. Our goal is to keep Osmo fresh and valuable by regularly updating it with techniques and solutions from our newest projects, ensuring you always have access to cutting-edge web development tools.
Get in touch
Have questions about Osmo? Want to request a specific component or tutorial? We're here to help you build websites people remember.
Our founders
Dennis Snellenberg
Creative Developer
Ilja van Eck
Creative Developer
Frequent topics
Join our community
Connect with us and other creative developers in our Slack community for discussions, tips, and inspiration.
Join our SlackSend us a message
Message sent successfully! We'll get back to you soon.