Designer
CMS
Ecommerce
Interactions
Memberships
Editor
Logic
SEO
Hosting
Security
Overview
Libraries
Apps
Hire a Certified Partner
Templates
Made in Webflow
Learn
Community
Ebooks
Forum
Blog
Support
LoginContact Sales
Get started — it's free
Made in Webflow

CSS only dark mode toggle with the :has() selector

Web Bae's avatar
Web Bae
Clone in Webflow245
site profile thumbnail
Open in Webflow
Open live site
The CSS :has() selector can be used to toggle dark mode, light mode, and themes with zero Javascript, just HTML and CSS. :has() finally arrived in all major browsers, having dropped in Firefox December 2023.
Open in Webflow
Open live site
css
darkmode
darktheme
toggle
darkmodetoggle
customcode
lightdarkmodetoggle
lightmodetoggle
togglebutton
toggleswitch
checkbox

More sites by Web Bae

See profile
The Greatest Infinite Marquee (HTML + CSS only)
765
7.2k
Moving Gradient Background
587
3.5k
Award Winning Grid Trail Mouse Follow Effect
433
1.2k

Similar sites

author avatar
IX2 Dark mode toggle
23
127
Philippe da Ponte
author avatar
CSS Color Scheme: prefers (dark)
53
58
Matthew P Munger
author avatar
Krause Studio™ (Dark-mode compatible)
18
Asger Krause
author avatar
Light/Dark Theme Toggle | Lord of the Rings
6
37
Cullen Kuch
author avatar
Modifying the styles of symbols with the :has() selector
3
4
Sam Pilgrim
author avatar
Light / dark mode toggle that persists using custom JavaScript
8
44
Lionize
Explore
  • Dashboard
  • Marketplace
  • Hire designers
Learn & get help
  • Support
  • University
  • Courses
  • Blog
  • Ebooks
  • Forum
  • Community
  • Developers
  • Wishlist
  • Status
Company
  • About
  • Careers
  • Sitemap
  • Become an Affiliate
Terms & policy
  • Terms of Service
  • Privacy policy
  • Cookie policy
  • Cookie preferences
Social
Social
Explore
  • Dashboard
  • Marketplace
  • Hire designers
Learn & get help
  • Support
  • University
  • Courses
  • Blog
  • Ebooks
  • Forum
  • Community
  • Developers
  • Wishlist
  • Status
Company
  • About
  • Careers
  • Sitemap
  • Become an Affiliate
Terms & policy
  • Terms of Service
  • Privacy policy
  • Cookie policy
  • Cookie preferences
Social
Social