13 个仓库
Capabilities for overriding native CSS variables to modify component appearance.
Distinguishing note: Focuses on runtime variable overrides rather than static theme configuration.
Explore 13 awesome GitHub repositories matching user interface & experience · CSS Variable Customization. Refine with filters or upvote what's useful.
Bulma is a design-agnostic CSS framework that provides a collection of pre-styled interface components and layout primitives. It is built to be independent of specific JavaScript frameworks or build tools, allowing developers to construct responsive web interfaces by applying standardized classes directly to semantic HTML markup. The framework distinguishes itself through a utility-first approach that combines modular component styling with a flexible grid system. It leverages native CSS variables to manage design tokens, enabling real-time visual customization, automatic dark mode adaptation
Allows overriding native CSS variables directly in stylesheets to change component appearance without recompiling code.
SpinKit is a UI component library and CSS animation library focused on providing a collection of animated loading indicators and spinners. It serves as a set of lightweight visual transitions designed to create motion and feedback within web interfaces. The library implements these indicators using pure CSS rendering and keyframe animations to notify users of active background processes. It uses a class-based styling system and minimal HTML structures to render visual cues without relying on scripts or images. Appearance can be adjusted through CSS variables and custom styles to modify color
Exposes style properties via CSS variables for easy customization of colors and dimensions.
Less.js is a CSS preprocessor and compilation engine that transforms a dynamic stylesheet language into standard CSS for web browser rendering. It functions as a tool to compile extended styling syntax, providing variables, mixins, and functions to create maintainable stylesheets. The project includes a source map generator that creates mapping files to link compiled CSS output back to the original source code for debugging. It allows for the integration of custom plugins and functions to automate the generation of final stylesheets within a build process. The engine supports the compilation
Embeds variables and expressions directly into selectors and at-rules during the compilation process.
Sass is a stylesheet compilation engine and CSS preprocessor that extends standard CSS with variables, nested rules, mixins, and functions. It functions as a comprehensive design system tool, enabling developers to organize complex stylesheets into modular, reusable components while automating the transformation of advanced syntax into browser-compatible CSS. The project distinguishes itself through its sophisticated build automation and language-level extensibility. It provides robust support for programmatic style generation, including conditional logic, iterative loops, and unit-aware math
Wraps stylesheet expressions within custom property values to ensure consistent evaluation and CSS compatibility.
SuperTokens Core is an open-source, self-hosted authentication and identity management platform designed for deployment within private infrastructure. It provides a comprehensive suite for managing user accounts, roles, and secure authentication flows, utilizing a modular, recipe-based architecture that allows developers to enable specific security features without modifying the core codebase. The platform distinguishes itself through its robust multi-tenancy capabilities, which allow for the logical or physical isolation of user records and configuration settings across different organizatio
Overrides default theme colors using CSS variables to match visual design and branding requirements.
intl-tel-input is an international telephone input widget that provides a country-aware phone number entry experience with automatic formatting, validation, and E.164 normalization. It combines a searchable country picker with a format-as-you-type engine and a validation rule engine that checks numbers against country-specific patterns, returning machine-readable error codes when a number is invalid. The project ships as both a zero-dependency vanilla JavaScript library and as framework-specific components for React, Vue, Angular, and Svelte, all sharing the same core logic through a framewor
Overrides design tokens such as colors through CSS variables to match a dark mode or brand theme.
Hamburgers is a CSS component library providing a collection of animated navigation icons. These components use CSS transitions to toggle between collapsed and active states, serving as reusable style definitions for interactive user interface elements. The library features customizable UI icons where colors and dimensions are controlled via CSS configuration variables. This allows for the modification of icon appearance and style during the build process. The project covers the implementation of animated menu navigation and responsive web interface design through the use of frontend visual
Provides customizable CSS variables for modifying the dimensions and colors of the navigation icons.
number-flow is an animated number UI component that creates fluid vertical transitions between numeric values using digit-by-digit animations. It serves as a locale-aware number formatter that represents values according to regional cultural rules and browser internationalization standards. The component is designed for precise visual integration, exposing internal elements via CSS to allow for external styling. It incorporates accessibility features by detecting browser capabilities and respecting system-level reduced motion preferences. The project covers capabilities for dynamic data visu
Uses shared CSS custom properties to synchronize the alignment of numeric elements in a horizontal row.
Spicetify Themes is a community-maintained collection of CSS-based visual themes for customizing the Spotify desktop client. The repository serves as a shared library of user-contributed themes that alter the appearance, layout, and sidebar configuration of the Spotify interface through the Spicetify modding tool. The theme system works by injecting custom CSS into Spotify's web-based UI through Spicetify's extension and loading mechanism, replacing default style files with user-provided themes at application startup. Themes use CSS custom properties for consistent color and spacing adjustmen
Uses CSS custom properties to allow consistent color and spacing adjustments across themes.
Material Tailwind 是一个基于 Tailwind CSS 构建的响应式 Web UI 框架和组件库。它提供了一个可定制的设计系统,为 Web 应用程序实现了 Material Design 原则。 该项目专注于可定制的设计系统,允许进行集中式主题配置和基于工具类的样式设置,以保持界面间的视觉一致性。 该库包含广泛的可重用界面元素,涵盖布局结构、导航系统和覆盖组件。它提供了用于 Web 表单构建、数据输入控件和视觉状态指示器的专业工具。
Allows dynamic updates to colors and spacing via native CSS variable overrides.
该项目是一个动画 UI 元素和 CSS 加载旋转图标库,旨在向用户指示后台进程。它提供了一系列预构建的 Vue 组件,封装了 CSS 动画以集成到 Web 应用中。 该库允许自定义旋转图标的外观,包括调整大小、颜色和动画速度以匹配特定的视觉品牌。这些指示器在异步操作期间提供视觉反馈,以确保前端用户体验保持活跃。
Provides the ability to override native CSS variables to adjust spinner appearance at runtime.
This project is a collection of themes, layout customizers, and automated installers for Visual Studio Code designed to create a dark-mode workspace aesthetic. It provides a set of dark color palettes and syntax highlighting configurations alongside a CSS UI customizer for modifying the editor's internal interface elements. The toolkit enables a modern visual design characterized by deep dark backgrounds, floating glass-effect panels, and rounded interface geometries. It utilizes custom stylesheets to alter panel radii, gaps, and sidebar margins, while adding interactive animations such as ho
Provides a collection of custom CSS variables to override native properties and modify editor appearance.
Oat is a CSS variable-driven UI kit and semantic HTML component library that styles native HTML elements and attributes contextually, eliminating the need for CSS classes and reducing markup bloat. It provides a complete theming system where all visual properties are defined as CSS custom properties, allowing dark mode toggling and custom color themes by setting a single data attribute on the root element. The library delivers interactive UI elements as zero-dependency WebComponents that require no framework, build tool, or external library, while also offering declarative scroll animations t
An admin dashboard and web interface toolkit that styles semantic HTML entirely through CSS custom properties with zero JavaScript dependencies.