Search results
43 packages found
React hook for subscribing to user's color scheme preference.
Extremely minimal stylesheet/setup for Web Extensions’ options pages (also dark mode)
- default
- normalize
- style
- stylesheet
- sanitize
- reset
- dark mode
- browser
- chrome
- firefox
- options
- prefers-color-scheme
A collection of stores that monitor the size, orientation, color scheme and scroll of the browser window.
Tools to detect, switch and save dark theme for react applications
This is a theme library that allows you to know the user's theme preference on the server and allow you to server pages with no hydration errors.
- next
- nextjs
- theme
- dark-mode
- light-mode
- background-color
- color-scheme
- prefers-color-scheme
- user-preference
- server
- hydration
- ssr
- server-side-rendering
- next-server-theme
A micro ES6 module (~0.5KB) for detecting a users preferred-color-scheme and watching for changes.
Storybook addon that adds ability to emulate render mode (css user preferences) of a story
- storybook-addons
- storybook-addon-render-modes
- render-modes
- prefers-reduced-motion
- conditions
- css
- emulate
- emulates
- emulation
- media
- query
- queries
- preferences
- prefers-color-scheme
- View more
Lightweight and customizable theme handler for Solid JS
Emulate CSS user preferences in Storybook
- storybook-addons
- conditions
- css
- emulate
- emulates
- emulation
- media
- query
- queries
- preferences
- prefers-color-scheme
- prefers-contrast
- prefers-reduced-data
- prefers-reduced-motion
- View more
A simple library for programatically consuming the CSS prefers-color-scheme media feature.
Provides system or user-defined color scheme preference, with a toggle mechanism. Settings are persisted, component is progressively enhanced and flash of unstyled content avoided. Also, it will provide an easier way to target theme with CSS / SCSS / JS.
- astro
- astro-component
- color
- theme
- switch
- toggle
- dark
- light
- mode
- progressive
- no-js
- scheme
- native
- prefers-color-scheme
- View more
The Ancillary Guide to Dark Mode and Bootstrap 5 - A continuation of the v4 Dark Mode POC
- bootstrap
- css
- sass
- mobile-first
- responsive
- front-end
- framework
- web
- dark
- dark-mode
- color
- color-scheme
- prefers-color-scheme
Shared core behind Magica11y’s functions.
- a11y
- accessibility
- css
- media-query
- level-5
- matchmedia
- prefers-reduced-motion
- light-level
- match-user-preference
- inverted-colors
- prefers-reduced-transparency
- prefers-contrast
- prefers-color-scheme
- forced-colors
🕯 Make your favicon adapt to dark and light mode
The shared core and build system behind Magica11y
- a11y
- accessibility
- css
- media-query
- level-5
- matchmedia
- prefers-reduced-motion
- light-level
- environment-blending
- inverted-colors
- prefers-reduced-transparency
- prefers-contrast
- prefers-color-scheme
- forced-colors
Detect system color scheme changes on the web (Dark Mode)
- color scheme
- dark mode
- detect
- system color
- color
- color-scheme
- prefers-color-scheme
- css
- media query
- light mode
Simple react theming library with prefers-color-scheme media support
Detect system (or manually set) preferences for color scheme and reduced motion.
Light- and dark-mode favicons, made easy.
Detects user’s color scheme preferences using the 'prefers-color-scheme' CSS3 level 5 media query.
- a11y
- accessibility
- css
- environment-blending
- forced-colors
- inverted-colors
- level-5
- light-level
- matchmedia
- media-query
- prefers-color-scheme
- prefers-contrast
- prefers-reduced-motion
- prefers-reduced-transparency