18 रिपॉजिटरी
Systems that implement light and dark color schemes entirely through CSS custom properties without JavaScript runtime switching.
Distinct from CSS Variable Theming: Distinct from CSS Variable Theming: focuses specifically on implementing light/dark theme switching via CSS custom properties, not general design token mapping.
Explore 18 awesome GitHub repositories matching user interface & experience · Light and Dark Theme Implementations. Refine with filters or upvote what's useful.
al-folio is a Jekyll academic theme and portfolio generator designed for researchers and professors to build professional homepages, lab sites, and research profiles. It functions as a system for creating a digital academic identity, combining a website template with tools for scientific and academic publishing. The project distinguishes itself through specialized scholarly workflows, such as automated publication lists and bibliography management driven by BibTeX files. It provides specific layouts for digital academic CVs, research portfolios, and the rendering of mathematical expressions a
Implements light and dark mode transitions using global CSS custom properties based on user preference.
Tomorrow Theme
Enables switching between light and dark variants of the same color scheme.
The minimal amount of CSS to replicate the GitHub Markdown style
Implements light and dark color schemes entirely through CSS custom properties and media queries without JavaScript.
twin.macro is a build-time style compiler and utility-first styling tool that converts Tailwind CSS utility classes into optimized style objects for JavaScript styling libraries. It acts as an integration bridge, allowing developers to use Tailwind design tokens and utility classes within a component-based architecture. The project distinguishes itself by performing transformations during the compilation phase rather than at runtime. It maps utility strings to CSS-in-JS engines such as Emotion and Styled Components, resolving design tokens directly from a Tailwind configuration file to ensure
Defines multiple visual variants and variables to create light and dark modes.
Metro UI is a progressive front-end framework for building reactive single-page applications with a Metro-style design language. It provides a component-based UI library with over 150 prebuilt interface elements, a reactive state model that automatically updates the DOM when application data changes, and a responsive grid layout system for mobile-first web development. The framework uses an HTML-first approach where interactive interfaces are assembled by adding custom HTML attributes to elements, eliminating the need for manual JavaScript glue code. It includes a hash-based SPA router for na
Toggles between dark and light color schemes across all components without custom configuration.
Hexo Theme Icarus is a modern, delicate theme for the Hexo static site generator. It provides a flexible layout and widget configuration system, with all appearance and behavior controlled through a single YAML or JSON configuration file that is validated against JSON schemas during each build. The theme distinguishes itself through a configuration-driven architecture that supports per-page and per-post layout overrides, automatic configuration migration, and a component override mechanism that allows replacing built-in widgets, comments, and share components by copying layout files. It integ
Switches the blog's visual style to a dark, cyberpunk-inspired color palette and imagery.
billboard.js is a JavaScript charting library built on D3.js that renders interactive data visualizations from a single declarative configuration object. It supports a wide range of chart types including bar, line, pie, scatter, area, spline, step, candlestick, funnel, gauge, heatmap, radar, polar, treemap, bubble, donut, and sparkline charts, and can overlay multiple chart types within a single visualization. The library offers an opt-in Canvas rendering mode for improved performance with large datasets and high-density axis displays, alongside its standard SVG-based rendering. The library d
Applies a dark color palette to all chart elements for low-light environments.
Theme-ui is a React theme framework and CSS-in-JS utility used for building themeable user interfaces. It functions as a design system tool that establishes centralized, constraint-based scales for colors, typography, and spacing to ensure visual consistency across applications. The framework distinguishes itself through an array-based responsive shorthand for mobile-first layouts and a dedicated color mode manager that synchronizes with browser preferences and persists user selections. It also features a system for creating named style variants to control component appearance via properties
Implements light and dark theme switching through the use of CSS custom properties.
ModernWpf Windows Presentation Foundation फ्रेमवर्क के लिए एक UI फ्रेमवर्क और कंट्रोल टूलकिट है। यह वर्तमान-पीढ़ी के डेस्कटॉप एप्लिकेशन लेआउट बनाने के लिए डिज़ाइन की गई आधुनिक शैलियों और विशेष इंटरफ़ेस तत्वों का एक संग्रह प्रदान करता है। लाइब्रेरी एक थीम और XAML स्टाइलिंग सिस्टम के रूप में कार्य करती है जो मानक इंटरफ़ेस तत्वों को अपडेट करने की अनुमति देती है। इसमें विज़ुअल थीम्स को मैनेज करने के लिए इन-बिल्ट समर्थन शामिल है, विशेष रूप से लाइट, डार्क और हाई कंट्रास्ट मोड्स के बीच स्विच करने को सक्षम करना। यह प्रोजेक्ट सामान्य WPF यूज़र इंटरफ़ेस डिज़ाइन को कवर करता है, जिसमें स्टाइल किए गए इनपुट, नेविगेशन और लेआउट कंट्रोल्स का कार्यान्वयन शामिल है।
Provides a set of visual themes including light and dark modes for standardizing WPF application appearance.
Astro Paper Astro फ्रेमवर्क के लिए एक न्यूनतम और सुलभ ब्लॉग थीम है, जिसे SEO-ऑप्टिमाइज़्ड स्टेटिक वेबसाइट बनाने के लिए डिज़ाइन किया गया है। यह व्यक्तिगत ब्लॉग और तकनीकी पोर्टफोलियो बनाने के लिए एक पूर्व-कॉन्फ़िगर टेम्प्लेट के रूप में कार्य करता है जो Markdown और MDX फ़ाइलों से कंटेंट रेंडर करता है। प्रोजेक्ट तकनीकी लेखन के लिए विशेष सपोर्ट के माध्यम से खुद को अलग करता है, जिसमें LaTeX गणितीय समीकरण रेंडरिंग और कोड सिंटैक्स हाइलाइटिंग शामिल है। यह डायनामिक Open Graph छवियों और सामाजिक मेटाडेटा के बिल्ड-टाइम जनरेशन के माध्यम से सोशल मीडिया उपस्थिति को भी स्वचालित करता है। फ्रेमवर्क साइट प्रबंधन क्षमताओं की एक विस्तृत श्रृंखला को कवर करता है, जिसमें बहुभाषी कंटेंट के लिए अंतर्राष्ट्रीयकरण, फुल-टेक्स्ट स्टेटिक सर्च, और स्वचालित साइटमैप और RSS फ़ीड जनरेशन शामिल है। दृश्य अनुकूलन को लाइट और डार्क मोड के लिए रंग पैलेट नियंत्रण और CSS वेरिएबल थीम स्विचिंग के माध्यम से संभाला जाता है। कंटेंट को फ़ाइल-सिस्टम आधारित राउटिंग और फ्रंटमैटर-संचालित मेटाडेटा के माध्यम से व्यवस्थित किया जाता है, जो स्वचालित तालिका (tables of contents) और स्टाइल किए गए कॉलआउट ब्लॉक्स जैसी सुविधाओं का सपोर्ट करता है।
Implements light and dark mode themes using CSS custom properties for efficient visual switching.
Saber is a cross-platform handwriting application and digital ink organizer designed for creating, storing, and managing handwritten notes. It functions as an encrypted note synchronization tool that keeps private content consistent across phones, tablets, and computers. The application features a handwriting interface framework that supports digital document annotation and a hierarchical file system for arranging notes into nested folders. It utilizes client-side end-to-end encryption to secure data before transmission and synchronizes state across devices via a cloud relay. The system incl
Ships a reactive engine that switches between light and dark visual styles by updating global color variables.
FlatLaf is a Java Swing look and feel library and theme engine that provides a modern flat design for desktop user interfaces. It serves as a comprehensive framework for applying visual themes, managing high-density scaling, and implementing customized window decorations. The project distinguishes itself through a flexible styling system that supports light and dark mode toggling and the ability to define visual identities via property files, subclassing, and external theme imports. It includes a dedicated scaling framework to ensure that interface elements and vector icons remain crisp on Hi
Provides a system for defining and applying visual styles through property files with support for light and dark modes.
This project is a Godot editor theme consisting of a collection of resource files that replace the default visual appearance of the engine interface with a minimalist aesthetic. It functions as a swappable presentation layer and a set of structured data assets designed to modify color palettes and layout properties. The theme implements a minimalist interface style that reduces visual clutter and simplifies layout properties. By utilizing structured resource files, it overrides default engine properties to create a cleaner and more focused workspace.
Applies visual styles via property-based resource files that allow the engine's interface to be themed at runtime.
This project is a cross-platform mobile UI framework and component library for building native interfaces. It provides a suite of pre-built interface controls and a scalable design system to ensure a uniform visual language across mobile screens. The library is centered on a theme-based system that uses a centralized configuration object to manage colors, spacing, and typography. This configuration propagates through the component tree, allowing developers to customize the global theme or apply local style overrides to individual elements. The framework includes a collection of reusable Mate
Utilizes a property-based theme engine to apply visual styles via configuration objects.
Vuestic UI is a Vue 3 component library providing a collection of pre-made user interface elements. It serves as a responsive UI framework and a themed component system designed to speed up frontend development and maintenance. The toolkit features a centralized configuration system for global styling and dynamic branding, including a built-in dark mode. It includes an internationalized interface toolkit with native support for localization and translating application content for multiple languages. The library provides a set of accessible web components that meet accessibility standards for
Implements a dark color palette for improved low-light readability through a built-in theme system.
Implements light and dark color schemes entirely through CSS custom properties with no JavaScript runtime switching.
Diagram Maker is a web-based library designed for building interactive graph visualization and data modeling tools. It provides a framework for rendering node and link structures, allowing users to create custom editing environments where complex data relationships can be visualized and manipulated directly in the browser. The library utilizes a modular, plugin-driven architecture that enables developers to extend the core editing functionality to meet specific requirements without altering the underlying source code. It manages the application state through a centralized, immutable store, en
Supports alternative color themes to improve readability in different lighting environments.
Chakra UI Vue is a component library for the Vue.js ecosystem that provides a collection of modular, accessible building blocks for constructing user interfaces. It functions as a design system provider, enabling developers to manage global design tokens and visual consistency across complex applications through a centralized theme provider. The framework distinguishes itself by integrating accessibility logic and WAI-ARIA attributes directly into its base components, ensuring that keyboard navigation and screen reader compatibility are handled by default. It utilizes a declarative styling ap
Implements automatic color scheme switching between light and dark themes to match user preferences.