13 مستودعات
Definitions for custom design tokens such as fonts, colors, and breakpoints used within styling frameworks.
Explore 13 awesome GitHub repositories matching user interface & experience · Theme Token Definitions. Refine with filters or upvote what's useful.
Utility-first CSS framework for fast, design-system-friendly styling.
Allows developers to define custom design tokens like colors and breakpoints directly within the configuration system.
Shiki is a syntax highlighting engine that generates color-coded HTML or ANSI output from source code. It functions as a static code highlighter, utilizing standard grammar definitions to parse text and apply accurate visual styling for documentation and terminal displays. The engine distinguishes itself by using a TextMate grammar parser to interpret text patterns, ensuring that code displays match the visual appearance of professional editors. It operates through an isomorphic runtime that supports both browser and server environments, utilizing WebAssembly for consistent execution and pre-
Maps semantic tokens to specific color values by applying theme definitions during the final rendering phase of the process.
Opentui is a terminal user interface framework for building interactive command line applications. It provides a component-based system featuring a flexbox layout engine, a virtual node component tree, and a low-level 2D cell array renderer. The project is distinguished by a sophisticated keyboard binding engine that maps complex multi-stroke sequences and chords to named commands using prioritized, reactive layers. It also implements a plugin architecture that allows external modules to inject custom UI components into designated layout slots and extend input logic at runtime. Its capabilit
Registers named tokens as semantic placeholders in binding strings to enable global updates via a single token.
UI Kitten is a cross-platform mobile UI library and design framework for building mobile interfaces. It provides a collection of reusable, accessible visual components and layout blocks that strictly follow the Eva Design System specifications. The library features built-in support for dynamic theming, allowing applications to switch between light and dark modes or custom color schemes at runtime. It utilizes a token-based color mapping system and a shared context provider to ensure visual consistency across all screens. The framework includes a library of standardized production-ready eleme
Maps semantic design tokens to specific hex codes to enable seamless switching between light and dark modes.
StyleX is a type-safe CSS-in-JS library and atomic CSS compiler that transforms JavaScript style definitions into optimized static CSS and type-safe class names. It functions as a multi-framework styling tool, generating standard CSS assets compatible with various JavaScript UI frameworks and server components. The system includes a CSS design token system and theme engine for managing shared constants and composing visual schemes. It allows for the creation of light, dark, and custom themes through variable overrides and token inheritance. The project covers component styling through object
Calculates new style variables from existing tokens at compile time to maintain a hierarchical theme.
tokyonight.nvim is a Lua-based Neovim plugin that provides a collection of dark and light color schemes and UI themes. It defines color palettes and highlight group configurations to manage syntax highlighting and the overall visual aesthetic of the editor. The project enables the export of terminal color palettes to maintain a unified visual style across terminal emulators and other system applications. It also includes mechanisms to match the visual style of third-party extensions to the primary theme for workspace consistency. Users can refine the visual appearance through color palette c
Integrates with the tree-sitter engine to map specific language elements to themed colors via semantic tokens.
This project is a suite of specialized tools for the implementation of a language server, template parsing, and static type validation of single-file components. It provides a language server and a type checker to deliver consistent intelligence and validation for Vue components across different editors and command-line environments. The tooling utilizes a template parser to transform single-file component structures into virtual code, enabling static analysis and type checking on HTML-like structures. This process allows for the extraction of component metadata regarding props, events, and s
Identifies specific code elements within components to provide precise syntax highlighting based on inferred meaning.
Nuxt UI is a comprehensive Vue component library built for the Nuxt ecosystem, providing over 125 production-ready, WAI-ARIA compliant components for building modern web applications. The library offers a complete design system with Tailwind CSS theming, supporting dark mode, custom color palettes, semantic color aliases, and runtime theme switching through CSS design tokens. It includes built-in internationalization for over 50 languages, server-side rendering compatibility, and a Figma kit that mirrors the code components for design-to-development consistency. The library distinguishes itse
Defines design tokens such as colors, fonts, and breakpoints using the @theme directive in CSS.
Astrowind is a high-performance site framework and bootstrapping tool designed for building marketing sites, professional portfolios, and high-conversion landing pages. It utilizes a utility-first CSS architecture and a component-based UI library to assemble responsive websites. The project specializes in conversion rate optimization through targeted templates for lead generation, product sales, subscription captures, and pre-launch teasers. It includes specific infrastructure for static blogging, utilizing markdown-based content modeling and rendering for long-form articles. The framework c
Provides definitions for custom design tokens including colors, fonts, and breakpoints.
SourceCodeSyntaxHighlight هو محرك لتمييز بناء الجملة ومصور للتحكم في الإصدار. يعمل كمميز لبناء جملة الكود المصدري يطبق أنظمة الألوان والتنسيق على لغات البرمجة للعرض البصري، وكأداة لتمييز تغييرات الكود والفروق (diffs) بالنسبة لالتزامات التحكم في الإصدار. تم تنفيذ المشروع كامتداد macOS Quick Look يوفر معاينات مميزة لبناء جملة ملفات الكود المصدري داخل Finder. كما يتضمن عميل بروتوكول خادم اللغة (LSP) لتوفير رموز دلالية ومعلومات عند التحويم أثناء معاينات الكود، وأداة واجهة سطر أوامر لمعالجة ملفات المصدر في دفعات إلى مخرجات مميزة. تغطي القدرات الإضافية تصور تغييرات التحكم في الإصدار عن طريق تمييز الأسطر المضافة أو المعدلة أو المحذوفة. يدعم النظام المعالجة المسبقة لملفات المصدر عبر نصوص برمجية مخصصة، وتخصيص المظهر البصري للألوان والخطوط، واستخدام مكتبات تمييز خارجية للرندرة.
Maps parsed code elements to semantic roles via language servers for precise syntax highlighting.
Everforest is a nature-inspired color scheme and syntax highlighting theme for Vim and Neovim. It provides a collection of light and dark color schemes designed with soft contrast to reduce eye strain. The theme features a green-based palette with adjustable background contrast and multi-variant color profiles to suit different ambient lighting. Users can modify the visual appearance through variable-driven customization and a configurable color palette. The project covers semantic syntax highlighting and UI element colorization to distinguish code logic across various programming languages.
Maps parsed code elements to semantic roles to provide precise syntax highlighting based on structural analysis.
This project is a visual customization theme for the Visual Studio Code editor, designed to improve code readability and developer comfort. It provides a collection of high-contrast color schemes and aesthetic configurations that adjust the appearance of the editor interface and syntax highlighting to support extended coding sessions. The theme focuses on reducing visual fatigue by optimizing color palettes and contrast levels for both low-light and high-brightness environments. It includes specific workbench overrides that define clear visual boundaries between the editor and sidebar areas,
Maps specific code elements like functions and variables to color tokens for precise syntax highlighting.
xstyled is a utility-first CSS-in-JS framework designed for the React ecosystem. It functions as a styling library that enables developers to manage component styles and responsive layouts by mapping design system tokens directly to component properties. The framework distinguishes itself by providing a centralized theme management system that propagates design tokens, such as colors and spacing, throughout the component tree. It includes a responsive layout generator that automatically calculates media query breakpoints based on viewport width, allowing for the creation of fluid grid structu
Allows extending theme definitions with custom tokens for full type safety.