Awesome GitHub RepositoriesCustom HTML Elements

Skeleton is a lightweight responsive CSS boilerplate and mobile-first framework. It provides a foundation for building mobile-friendly websites through a fluid 12-column grid system, a minimal CSS reset library to normalize browser defaults, and default styling for raw HTML elements. The project emphasizes a mobile-first development approach, using percentage-based widths and predefined media queries to progressively enhance layouts for larger screens. It includes a utility-first library of single-purpose classes to manage common layout tasks such as floating elements, clearing, and width con

Base UI is a headless component library and unstyled framework providing accessible interface primitives. It decouples behavioral logic and state management from the visual layer, allowing developers to implement complex UI patterns while maintaining total control over the final styling. The library implements WAI-ARIA design patterns to ensure all primitives support standard keyboard navigation and screen reader accessibility. It provides a suite of low-level building blocks that handle the internal mechanics of interface elements without bundling any CSS. The framework covers a broad range

Markdoc is a documentation content framework that extends standard Markdown with custom tags, typed schemas, and reusable components, parsing content into an abstract syntax tree and rendering it as React elements or HTML. It provides a structured authoring system where documents are processed through an AST-based pipeline, enabling validation, transformation, and flexible output generation. The framework distinguishes itself through a schema-driven validation pipeline that checks document structure and attribute values against defined rules, and a pluggable renderer architecture that accepts

Rebass is a React design system library that provides a collection of theme-driven, responsive UI primitives. It functions as a theme-based layout engine, using a set of stateless components to standardize spacing, typography, and colors across a user interface. The library distinguishes itself by mapping style properties to a central design theme through a styled-system approach. This allows for responsive style mapping where components automatically adapt their appearance based on screen size and provides the ability to swap underlying HTML elements while preserving styling logic to maintai

This project is an HTML email framework and compiler designed to build responsive emails using a high-level syntax that transforms into table-based layouts. It functions as an HTML-to-table compiler and CSS inliner, ensuring that simplified markup is converted into the complex nested structures and inline attributes required for cross-client compatibility. The framework features a responsive email grid system and Sass-based styling, allowing the use of variables to manage colors, typography, and spacing. These tools enable custom brand theming and the creation of fluid layouts that adapt to v

cva is a TypeScript utility for defining and resolving visual variants for UI components with full type safety. It generates CSS class strings from typed variant definitions, enabling compile-time validation of component usage by deriving the union of all variant prop types from a configuration object. The library distinguishes itself through compound variant matching, which activates styles only when multiple independent variant conditions are simultaneously satisfied, merging their class names. It also provides default value propagation to ensure consistent rendering when no explicit varian

FastHTML is a full-stack Python web framework designed for building interactive web applications using pure Python. It functions as an HTMX integration framework and a Python HTML domain-specific language, allowing developers to generate HTML structures using native objects and functions instead of external templating files. The framework is distinguished by its native support for real-time bidirectional communication via WebSockets and Server-Sent Events, enabling server-side updates to be pushed to the browser without full page reloads. It further integrates identity management through OAut

Mesop is a stateful, declarative Python web UI framework and component library designed for building interactive web applications and AI demos. It allows for the construction of data-driven interfaces and chat systems using only Python, removing the need to write separate HTML or CSS. The framework is specifically tailored for AI application development, offering dedicated tools for conversational UI design and the creation of dashboards for large language model applications. It distinguishes itself with a visual UI editor for real-time property adjustments and the ability to embed custom Jav

Waku is a minimal React framework built around React Server Components. It renders components exclusively on the server for data fetching and server-side logic, then hydrates client components in the browser for interactivity. The framework supports hybrid rendering, mixing static prerendering at build time with dynamic per-request rendering within a single application, and allows independently loading slice components that can be static or dynamic. The framework distinguishes itself through its file-based routing system that defines pages, layouts, and API endpoints by placing files in a dir

Reach UI is an open-source library of accessible, low-level React components designed to serve as a foundation for building design systems and interactive user interfaces. It is an accessibility-first toolkit that handles core concerns like ARIA attributes, focus management, and screen reader support automatically, without requiring developer configuration. The library is built as a collection of standalone packages, each managing its own lifecycle and dependencies, enabling granular adoption and tree-shaking. Components use a polymorphic rendering pattern, accepting an as prop to render as

Vetur is a Visual Studio Code extension that provides comprehensive language support for Vue single-file components. It parses .vue files into separate template, script, and style regions, then delegates each region to its own language service for independent processing. This architecture enables IntelliSense, type-checking, formatting, and linting across all embedded languages within a Vue file. The extension distinguishes itself through deep integration with Vue's component model. It infers TypeScript types for template expressions by analyzing component props, data, and computed properti

一个为 Hexo 框架构建的响应式 Material Design 静态博客主题。它作为一个综合布局系统，将 Markdown 文件转换为样式化的 HTML 页面，为技术文档和个人博客提供了一个专门的环境。 该主题的特点是采用数据驱动的内容可视化方法，使用雷达图表示分类，使用词云表示标签，以呈现文章元数据。它通过为博客归档使用时间轴架构进一步优化了组织结构。 该项目涵盖了广泛的技术发布功能，包括数学公式渲染、代码块语法高亮以及自适应目录生成。它包括通过动态主页、多级导航菜单和详细个人资料页面进行网站定制的工具。通过集成搜索功能、密码保护文章以及嵌入第三方评论和聊天系统来支持读者互动。 性能通过 CDN 资源路由和资产预加载进行管理，而搜索引擎可见性则通过可配置的 SEO 元数据进行处理。

Lovelace Mushroom 是一个用于 Home Assistant 的自定义卡片集和 UI 库，旨在显示和控制智能家居设备实体。它提供了一个框架，用于构建简洁、可视化的仪表板和控制界面来管理连接的硬件。 该库包含一个主题框架，允许应用自定义调色板并使用浅色或深色模式。用户可以使用内置的选择器和可视化编辑器配置卡片外观和视觉主题，无需手动修改源代码。

Kraken 是一个跨平台 UI 框架和 Web 标准运行时，旨在通过标准 Web 标记和样式构建原生应用。它利用基于 Flutter 的渲染引擎来处理 HTML 和 CSS，在移动和桌面平台上产生视觉上一致的用户界面。 该系统通过将运行时编译为机器代码并采用同步光栅化流水线来确保动画和滚动与原生应用的流畅度相匹配，从而脱颖而出。它进一步将高性能原生组件直接集成到 Web 标准文档对象模型树中，允许定义由原生小部件支持的自定义 HTML 标签。 该框架涵盖了广泛的功能面，包括 JavaScript 组件树执行、全局和本地状态同步以及标准化的手势处理。它还提供了一个基于插件的系统，用于通过自定义后端函数扩展 API，并支持与各种前端框架的集成。 开发者工作流通过与 Chrome DevTools 协议的集成得到支持，从而实现应用状态检查和 UI 样式修改。

该项目是一个交互式教程生成器和静态网站生成器，可将 Markdown 和 Google Docs 等源文档转换为结构化的教学指南。它作为一种文档转换工具，将源内容编译为静态 HTML 资产和元数据，以便分发给公共或私有受众。 该系统利用自定义元素 UI 框架，使用标准 HTML 自定义元素嵌入交互式教学组件，无需依赖外部 JavaScript 框架。它支持多格式内容导出，允许将单一事实来源转换为包括 HTML 和 Jupyter Notebook 在内的多种目标格式。 该平台提供教学内容管理功能，通过元数据和标签将教程组织成主题集合和落地页。它涵盖了完整的发布生命周期，从本地预览托管和静态资产生成，到部署至云存储，以及通过集成分析工具跟踪用户参与度。

Derby 是一个同构 MVC 框架和实时数据同步引擎，专为构建协作应用程序而设计。它作为一个双向数据绑定库和模板引擎，在 Node.js 和浏览器之间共享同一代码库，以同步客户端和服务器之间的状态。 该框架的特色在于使用操作转换（operational transformation）自动解决数据冲突，从而实现实时共享编辑和多用户协作。它采用差异化状态突变模型，通过执行深度相等性检查来最小化更新，确保仅传播已更改的值。 该平台涵盖了广泛的功能，包括响应式状态管理、同构路由和模块化 UI 组件开发。它提供了用于管理嵌套数据路径、执行同构渲染以实现快速初始加载，以及与服务器中间件集成的工具。 该系统使用 TypeScript 实现。

mPDF 是一个 PHP 库，可将 UTF-8 编码的 HTML 和 CSS 转换为格式化的 PDF 文档。它作为 PDF 生成引擎和文档架构师，能够将网页和 HTML 表单转换为专业文件。 该项目以其多语言渲染能力而著称，通过 Unicode 字体嵌入和 OpenType 布局处理，为双向文本、从右到左脚本和 CJK 语言提供全面支持。它还通过 CMYK 高级色彩建模、精确的页面尺寸标注以及符合 PDF/A 和 PDF/X 归档标准，实现了专业的打印就绪设计。 该库涵盖了广泛的文档布局和交互功能，包括交互式表单、书签和可搜索索引的生成。它为页面模板、页眉页脚和复杂的表格数据渲染提供了详细的控制。其他功能包括 PDF 加密、用于文件大小优化的字体子集化，以及将外部 PDF 页面导入为模板的能力。 该系统与符合 PSR-3 标准的日志记录集成，以跟踪内部事件和执行错误。

Streamdown is a streaming markdown renderer for React that transforms incoming markdown text into sanitized HTML in real time, handling incomplete blocks as they arrive. It parses GitHub-Flavored Markdown syntax including tables, task lists, and footnotes, and renders LaTeX math expressions using KaTeX, Mermaid diagrams as interactive SVGs, and code blocks with Shiki-based syntax highlighting supporting over 200 languages with dual light and dark themes. The renderer includes an XSS-safe HTML sanitizer that strips dangerous tags and validates URLs to prevent injection attacks. What distinguis

Heml is a framework providing a custom markup language and compiler designed to generate responsive HTML and CSS for consistent rendering across email clients. It functions as a system for transforming specialized markup strings into deliverable email templates and associated metadata. The project features a component system for defining reusable custom elements and style rules to standardize design patterns. It includes a responsive layout engine that converts flexible grid structures, columns, and rows into compatible fixed-width tables and fluid layouts. The toolset covers email metadata