Combine three new CSS features to build fully adaptive themed components.
Modern CSS snippets. Every old hack, replaced.
Side-by-side comparisons of outdated CSS techniques and their modern native replacements. Grid, custom properties, nesting, container queries, and more.
Modern CSS snippets. Every old hack, replaced.
Side-by-side comparisons of outdated CSS techniques and their modern native replacements. Grid, custom properties, nesting, container queries, and more.
OS X Aqua - Kagi Search Theme
A custom theme that's inspired by old school Apple's OS X Aqua theme. Has both Dark and Light mode that changes based on your system settings. ** [Github repo](https://github.com/Visnes/kagi-aqua/) ** Do the following: Go to Appearance → Change theme to "Default", not "Light" or "Dark" → Enable Custom CSS & Paste custom.css → Save changes
Aesthetics Wiki | Fandom
Thank you to the winner of our redesign contest, Ethan Duke! The background and wordmark are both his work. You can check him out on both Instagram and Twitter at @theduke2442! The dark mode was designed by Gwenanenn.
🧛 Official Dracula & Alucard Theme - Kagi Search Theme
A modern and sleek custom theme for Kagi that follows the styling rules of the very popular [Dracula theme](https://draculatheme.com). **Features** - Automatic dark and light mode based on system - All(?) elements have been skinned - Responsive to desktop, tablet & mobile **Install** - Go to Appearance and change theme to "Default" - Enable Custom CSS, paste content of custom.css and save **[Github repo](https://github.com/dracula/kagi)**
Dark mode with web standards
Implementing dark mode with minimal JavaScript and standard CSS
The CSS Selection - 2026 Edition - Project Wallace
The CSS Selection shows real-world CSS usage from over 100,000 websites and looks at the most important metrics.
Mac OS Liquid Glass - Kagi Search Theme
A modern and sleek custom theme for Kagi based on liquid glass introduced in Mac OS Tahoe. **Features** - Automatic dark and light mode based on system - All(?) elements have been skinned - You can configure look at top of file - Responsive to desktop, tablet & mobile - Refracts what's behind elements **Install** - Go to Appearance and change theme to "Default" - Enable Custom CSS, paste content of custom.css and save **[Github repo](https://github.com/Visnes/kagi-liquid-glass)**
Using CSS to fix the irradiation illusion · November 29, 2025
How to adjust perceived font weight in dark mode without layout shift
Preserving the Pixel Art Look in Web Content
Learn essential CSS techniques, scaling strategies, and design principles that preserve the crisp, totally-cool aesthetic of pixel graphics across high-resolution displays and responsive web environments.
Native-Like Animations for Page Transitions on the Web | CSS-Tricks
Some of the most inspiring examples I’ve seen of front-end development have involved some sort of page transitions that look slick like they do in mobile
A self-styling `style` element - makes itself visible & styles itself to look like code printed on an alternating line background with lateral perforations (real transparency allows to see through holes to the backdrop) codepen.io/thebabydino/pen/wBBLJrz?edito… If you're looking for original code boxes...🐱 #CSS
