Projects in Awesome Lists tagged with css-variables

https://github.com/l-hammer/You-need-to-know-css

💄CSS tricks for web developers~

css css-animations css-center css-effects css-experiment css-flexbox css-layout css-properties css-scrollbar css-shadow-parts css-shapes css-snippets css-transitions css-tricks css-variables css3 cssnext docsify pseudo-elements

Last synced: 14 Mar 2025

https://github.com/l-hammer/you-need-to-know-css

💄CSS tricks for web developers~

css css-animations css-center css-effects css-experiment css-flexbox css-layout css-properties css-scrollbar css-shadow-parts css-shapes css-snippets css-transitions css-tricks css-variables css3 cssnext docsify pseudo-elements

Last synced: 18 Oct 2025

https://github.com/halfmoonui/halfmoon

Halfmoon is a highly customizable, drop-in Bootstrap replacement. It comes with three built-in core themes, with dark mode support for all themes and components.

bootstrap bootstrap5 css css-custom-properties css-framework css-variables dark-mode dark-theme dashboard halfmoon web-framework

Last synced: 13 May 2025

https://github.com/saadeghi/theme-change

Change CSS theme with toggle, buttons or select using CSS custom properties and localStorage

css-custom-properties css-theme css-variables javascript localstorage theme theming

Last synced: 12 Apr 2025

https://github.com/nuxodin/ie11CustomProperties

CSS variables (Custom Properties) polyfill for IE11

css-variables custom-properties ie11 polyfill

Last synced: 13 May 2025

https://github.com/hyperfocalHQ/pollen

The CSS variables build system

css css-framework css-utilites css-variables design-system functional-css tailwindcss utilty-classes

Last synced: 17 Jul 2025

https://github.com/colinespinas/darken

🌑 Dark mode made easy

css-variables darkmode javascript javascript-library prefers-color-scheme user-preference vanilla-javascript

Last synced: 16 May 2025

https://github.com/ColinEspinas/darken

🌑 Dark mode made easy

css-variables darkmode javascript javascript-library prefers-color-scheme user-preference vanilla-javascript

Last synced: 14 May 2025

https://github.com/innocenzi/tailwindcss-theming

CSS-variables-based swappable themes for Tailwind CSS

color css-variables custom-properties dark dark-mode dark-theme prefers-color-scheme tailwindcss tailwindcss-plugin

Last synced: 04 Apr 2025

https://github.com/kristerkari/react-native-css-modules

Style React Native components using CSS, PostCSS, Sass, Less or Stylus.

css css-modules css-variables less media-queries postcss react-native sass stylus viewport-units

Last synced: 06 Apr 2025

https://github.com/willofindie/vscode-cssvar

VSCode extension to support CSS Variables Intellisense

autocomplete css css-custom-properties css-variables cssvar cssvariables extension suggestion var variables variables-css visual-studio-code vscode vscode-extensions

Last synced: 21 Feb 2026

https://github.com/Wildhoney/Switzerland

🇨🇭Switzerland takes a functional approach to Web Components by applying middleware to your components. Supports Redux, attribute mutations, CSS variables, React-esque setState/state, etc… out-of-the-box, along with Shadow DOM for style encapsulation and Custom Elements for interoperability.

component component-architecture components css-variables custom-elements functional immutable shadow-dom virtual-dom webcomponents

Last synced: 15 Nov 2025

https://github.com/wildhoney/switzerland

🇨🇭Switzerland takes a functional approach to Web Components by applying middleware to your components. Supports Redux, attribute mutations, CSS variables, React-esque setState/state, etc… out-of-the-box, along with Shadow DOM for style encapsulation and Custom Elements for interoperability.

component component-architecture components css-variables custom-elements functional immutable shadow-dom virtual-dom webcomponents

Last synced: 07 Apr 2025

https://github.com/just-animate/just-animate

Making Animation Simple

animation animation-controller css-variables easings multiple-animations svg-animations timeline transitions typescript waapi web-animation

Last synced: 12 Jan 2026

https://github.com/kaisermann/svelte-css-vars

:sparkles: Ever wanted to have reactive css variables in svelte? What if I told you there's a way?

css css-variables custom-properties reactive state svelte

Last synced: 13 Apr 2025

https://github.com/mertasan/tailwindcss-variables

Easily create css variables without the need for a css file!

css-variables dark-mode multi-theme tailwind tailwindcss tailwindcss-variables

Last synced: 16 May 2025

https://github.com/shospodarets/css-vars

Sass mixin to use CSS Custom Properties with Sass

css css-custom-properties css-variables sass sass-mixins scss

Last synced: 21 Aug 2025

https://github.com/vunguyentuan/vscode-css-variables

CSS variables autocomplete for vscode

autocomplete css-variables extension vscode vscode-extension

Last synced: 05 Apr 2025

https://github.com/josefaidt/svelte-themer

A theming engine for your Svelte apps using CSS Variables, persisted.

css-variables svelte theme theming

Last synced: 09 Apr 2025

https://github.com/idev-games/trig-js

Trig.js powers dynamic, CSS-driven animate-on-scroll effects using CSS variables and element position data, making AOS effortless. Create custom animations in CSS or use trig-animations.css for ready-made effects—full control or quick setup. Perfect for storytelling websites.

animate-on-scroll animation aos-animation css css-animations css-variables data-attribute-html design frontend html js reveal-animation scroll-animations simple

Last synced: 05 May 2025

https://github.com/richardtallent/vue-stars

Flexible VueJS input control for ratings (stars, etc.).

css-variables hover-animations input stars vue vue-components

Last synced: 10 Apr 2025

https://github.com/tomhodgins/computed-variables

Easy to use event-driven CSS variables

css css-reprocessor css-variables cssom custom-properties custom-property reprocessor variables

Last synced: 20 Jan 2026

https://github.com/pveyes/theme-in-css

Type-safe CSS custom properties (CSS variables) for theming purpose

css css-properties css-variables oss theme typescript

Last synced: 26 Oct 2025

https://github.com/srmullen/svelte-reactive-css-preprocess

Automatically update your styles when a svelte variable changes.

css css-variables javascript preprocessor reactivity sveltejs

Last synced: 30 Jul 2025

https://github.com/ionicthemes/ionic6-starter-app

🌟 Ionic Starter Template. It has everything you need to jump start your Ionic Angular app development! Firebase Integration, Capacitor, PWA, Lists, Cards, Navigation, Forms and Validations and SO MUCH MORE! 🚀

angular angular13 capacitor css-variables firebase ionic ionic-angular ionic-framework ionic-pwa ionic-starter ionic-template ionic6 progressive-web-app pwa

Last synced: 24 Apr 2025

https://github.com/danbahrami/react-custom-properties

A React component for applying CSS Variables (Custom Properties)

css-custom-properties css-variables react

Last synced: 22 Sep 2025

https://github.com/daniil4udo/bulvar

🛣 Bulma, Buefy and Bulma Extensions rewritten using CSS Variables

buefy bulma css css-properties css-variables sass scss

Last synced: 08 Oct 2025

https://github.com/mrahhal/css-theming

A platform for CSS theming.

css css-variables scss theme theming

Last synced: 22 Jun 2025

https://github.com/nuxodin/css-variables-name-conventions

Custom properties: Naming conventions

conventions css-variables naming naming-conventions

Last synced: 23 Jan 2026

https://github.com/sparanoid/kladenets

Future-proof native CSS variables in :root

css css-variables

Last synced: 05 May 2025

https://github.com/raulghm/multi-brand-colors

Multi Brand Colors with support for CSS/CSS-Vars/SCSS/SASS/Stylus/LESS/JSON

brand color colors css css-variables json less multi-brand-colors postcss sass scss stylus w3c

Last synced: 17 Oct 2025

https://github.com/morewings/css-vars-hook

Bring dynamic styling into your React components with css-vars-hook. Simple and intuitive hooks for managing CSS Custom Properties. Integrate styles with component logic.

css-custom-properties css-in-js css-in-react css-variables hook react react-hook

Last synced: 16 Jun 2025

https://github.com/philippebeck/animadio

CSS Library made with Sass

animations box-model css-variables css3 flexbox grid hsla-colors library scss transform

Last synced: 24 Jul 2025

https://github.com/betahuhn/drkmd.js

🌓 Simple dark-mode/light-mode logic for any website.

css-variables dark-mode-switcher dark-mode-toggle dark-theme darkmode javascript nightmode npm-package prefers-color-scheme theme vanilla-js

Last synced: 06 Mar 2026

https://github.com/enjidev/tailwindcss-accent

Adds accent colors for more dynamic and flexible color utilization.

accent-color css-custom-properties css-variables tailwind tailwindcss tailwindcss-plugin tailwindcss-v2 tailwindcss-v3 theming

Last synced: 11 Jun 2025

https://github.com/tymekdev/no-js-dark-mode-toggle

An example of a dark mode toggle without JavaScript

css css-variables dark-mode dark-theme html prefers-color-scheme

Last synced: 03 Jul 2025

https://github.com/ahmadrezamozaffary/belfius-banking

HTML - CSS - JS 🏅

arrow-functions countdown css-flexbox css-variables css3 currency-converter date-time es6 html5 intl-api javascript loan login-page logout media-queries responsive-web-design statistics this-keyword transfer-money

Last synced: 26 Jun 2025

https://github.com/zvizvi/freewindcss

🍃 Use Tailwind's set values and units in pure CSS variables

css css-variables tailwindcss

Last synced: 23 Mar 2025

https://github.com/jh3y/focussed-twitter

Let's focus on the tweets! 🐦

chrome-extension css-variables firefox-extension hacktoberfest hacktoberfest2020 javascript twitter

Last synced: 21 Mar 2025

https://github.com/codebase-frontend-library/codebase-5

A business class CSS style library for the modern web

accessibility alpine-js color-mix css-framework css-grid css-variables oklab sass-library

Last synced: 14 Apr 2025

https://github.com/meduzen/v-helper

A shorter SCSS access to CSS custom properties.

css css-custom-properties css-variables sass scss scss-function

Last synced: 09 Sep 2025

https://github.com/denisraslov/stylelint-value-no-exposed-custom-properties

A stylelint rule to disallow usage of exposed custom properties

css-variables custom-properties stylelint

Last synced: 01 Aug 2025

https://github.com/jdrupal-dev/css-vars.nvim

Neovim plugin for css variable autocompletion

css-variables neovim-plugin

Last synced: 10 Nov 2025

https://github.com/ionicthemes/how-to-build-any-ui-with-ionic

Explore different strategies you can use to customize and extend the Ionic UI Components to create any UI you want.

css-variables ionic ionic-apps ionic-framework ionic5 stencil web-components

Last synced: 24 Apr 2025

https://github.com/thisisjuke/tailwindcss-css-variables-palette-plugin

Generate a color palette 🎨 using CSS variables 🔡 for TailwindCSS 🍃

css-variables palette-generation tailwindcss tailwindcss-plugin

Last synced: 10 Apr 2025

https://github.com/keithamus/openswatch

An open color system using oklch to create a flexible and decomposable palette using modern CSS

color-palette css css-variables oklch swatch tokens

Last synced: 05 Apr 2025

https://github.com/jorger/calculator_the_game_reactjs

:bulb: Calculator The Game - ReactJS

create-react-app css-variables css3 games javascript progressive-web-app reactjs service-worker

Last synced: 03 May 2025

https://github.com/moumen-soliman/shortcut.css

Shortcut.css is the first css package it support your stylesheet, Contain custom & built-in variables and classes you can use it with any situation you want with css shortcuts for more flexiblity & stability.

css css-framework css-selector css-shortcuts css-variables css3 npm npm-package

Last synced: 08 Aug 2025

https://github.com/startpolymer/s-grid

s-grid is a helper class useful for creating responsive, fluid grid layouts using CSS Custom Properties.

css-custom-properties css-grid css-variables grid polymer polymer-styles

Last synced: 08 Nov 2025

https://github.com/nkt/css-variables-parser

CSS variables parser

css-variables parser postcss

Last synced: 16 Apr 2025

https://github.com/kolebayev/valor-figma-plugin

Figma plugin for color pallette representation

color css-variables design-tools figma figma-api figma-plugins

Last synced: 15 Apr 2025

https://github.com/itsjonq/stylis-plugin-css-variables

🔄 Transforms CSS variable into static values for non-supported browsers

css-in-js css-variables plugin stylis variables

Last synced: 10 Apr 2025

https://github.com/ahmadrezamozaffary/belfius-banking-landing

Implement some useful and advanced DOM manipulations 🏅

advanced-dom css-box-model css-flexbox css-variables css3 dom-manipulation dom-traversal dom-tree dropshadow es6 html5 intersectionobserver-api javascript lazy-loading navbar responsive responsive-design semantic-html slider-component tabbed-component

Last synced: 10 Apr 2025

https://github.com/sya-ri/css-var-extract

Use CSS variables type-safely for CSS-in-JS. Generate at build time, has no runtime dependencies, and can be optimized.

css css-in-js css-variables react rsbuild rsbuild-plugin rspack rspack-plugin vite vite-plugin webpack webpack-plugin

Last synced: 04 Jul 2025

https://github.com/iamsainikhil/keyboard

A virtual keyboard to explore cool themes and custom key functions.

color-picker css css-grid css-variables css3 dom-manipulation flexbox html html5 javascript

Last synced: 26 Oct 2025

https://github.com/inwerpsel/design-mode

A React theme editor

css css-variables custom-properties custom-props dev-mode drag-and-drop history-management html low-code react reactjs theme theme-editor themes

Last synced: 11 Jul 2025

https://github.com/lukethacoder/cytoscape-css-variables

🎨 add CSS Variable functionality to cytoscape.js

css-variables cytoscapejs cytoscapejs-extension

Last synced: 22 Jul 2025

https://github.com/georginapuig/javascript30

30 day vanilla javascript coding challenge

algorithms cornify css css-variables datastructures devtools drum-kit flex html html-canvas javascript javascript30 js-clock key-sequence vanilla-javascript videoplayer wesbos

Last synced: 23 Apr 2025

https://github.com/ediamin/wp-block-theme-companion

A VSCode extension for WordPress Block Theme development

autocomplete css-variables gutenberg gutenberg-theme theme-json vscode vscode-extension wordpress

Last synced: 24 Jul 2025

https://github.com/bjankord/styled-components-custom-properties-theme-provider

Custom theme provider which uses CSS custom properties in browsers that support them, and falls back to styled components theme provider implementation in browsers that don't support CSS custom properties. 💅

css-custom-properties css-theming css-variables styled-components theme-provider

Last synced: 14 Apr 2025

https://github.com/yarastqt/postcss-theme-fold

Postcss plugin for folding css-variables with using whitepaper design system in legacy browsers.

css-variables postcss postcss-plugin whitepaper

Last synced: 04 Apr 2025

https://github.com/Inwerpsel/design-mode

A React theme editor

css css-variables custom-properties custom-props drag-and-drop history-management html low-code react reactjs theme theme-editor themes

Last synced: 02 May 2025

https://github.com/ahmadrezamozaffary/email-template

HTML - Inline CSS

box-sizing css-reset css-variables css3 flex html5 internal-css media-queries mobile-first-css responsive

Last synced: 10 Apr 2025

https://github.com/merri/alku

We are divergent. The CSS framework for people who desire to have more accessible defaults.

classless-css css css-framework css-reset css-utilities css-variables html-attributes normalize-css postcss

Last synced: 17 Oct 2025

https://github.com/saddamarbaa/microsoft-homepage-clone

==> Microsoft homepage from scratch a responsive layout "Mobile First Design" using HTML5/CSS and a bit of JS, modern CSS features, and techniques including CSS grid, flexbox, and media queries .....

complete-responsive-website css-flexbox css-grid css-units css-variables media-queries

Last synced: 25 Jul 2025

https://github.com/chrisburnell/bowhead

Memorable and maintainable design tokens in SCSS.

css css-variables design-tokens scss

Last synced: 18 Mar 2025

https://github.com/oleksiyrudenko/default-beauty.css

Make default browsers' styles prettier

css css-variables css3-variables default-beauty

Last synced: 25 Mar 2025

https://github.com/nauvalazhar/faceless

The hated login page

css-variables css3 form html5 kodinger login register

Last synced: 16 Aug 2025

https://github.com/p-chan/object-to-css-variables

A library to convert JavaScript Object to CSS Variables

css css-variables custom-media-queries custom-media-query custom-properties custom-property

Last synced: 14 Aug 2025

https://github.com/dinanathsj29/css-variables-practical-guide-tutorial

Lets learn to use CSS variables a CSS custom properties to create style sheets less repetitive, easier to maintain, better readability and more flexible.

css-custom-properties css-var-function css-variable-value css-variables global-scoped-variables local-scope-variable var-function variable variables-and-their-usages variables-css

Last synced: 20 Mar 2025

https://github.com/peterbenoit/themetoggler

ThemeToggle is a lightweight JavaScript library that allows you to easily switch between light and dark themes on a webpage

color-scheme color-theme color-theme-switcher css-variables dark-light-toggle dark-mode javascript light-mode theme-switcher theme-toggle user-preferences

Last synced: 12 Feb 2026

https://github.com/siteation/magento2-theme-tokens

Customize your theme with ease with Design Tokens (CSS props)

css-props css-variables design-tokens hyva hyva-compatibility-module magento2 magento2-module

Last synced: 03 May 2025

https://github.com/holtwick/desertcolors

macOS System Colors - Light & Dark Mode

css css-variables dark dark-mode dark-theme html html5 macos mojave

Last synced: 03 Mar 2026

https://github.com/fylgja/tailwindcss-plugin-cssprops

A plugin for Tailwind CSS that streamlines CSS variable management

css-props css-variables design-tokens fylgja tailwindcss tailwindcss-plugin

Last synced: 24 Jul 2025

https://github.com/0xstern/tailwind-resolver

Resolve Tailwind theme variables into JavaScript objects. Supports Tailwind v4 with future-proof versioning.

canvas chart css-variables parser postcss resolver tailwind tailwindcss tailwindcss-v4 theme theme-resolution typescript

Last synced: 23 Oct 2025

https://github.com/ahmed-elrashidii/mealify

"Mealify" is a responsive restaurant landing page that offers a delightful and engaging user experience. The website showcases various sections including a home page, chefs' profiles, a gallery of appetizing dishes, and a contact section.

css-pseudo-classes css-pseudo-elements css-variables css3 css3-animations dark-mode flexbox-css font-awesome html5 media-embed media-queries responsive-layout semantic-tags vendor-prefix web-development

Last synced: 09 Apr 2025

https://github.com/jamesgeorge007/css-variables

Demonstrates the use-cases of css variables in a real project.

css-variables css3 dom-manipulation html5 javascript vanilla-js

Last synced: 21 Feb 2025

https://github.com/b2wads/grimorio-ui

Grimório✨ | UI just like magic

css-modules css-variables react uikit

Last synced: 02 Jul 2025

https://github.com/goganotclown/accordion

A lightweight and customizable JavaScript accordion to enhance your website's interactivity. Easily create collapsible content sections with smooth transitions for a user-friendly experience.

accordion animation collapsible css-variables css3 customizable frontend html5 interactive javascript mit-license responsive-design scss ui-component user-interface web-development