• UI Libraries
    • COSS UI

    COSS UI

    coss.com

    一個基於 Base UI 構建的全新現代化 UI 元件庫。

    Base UI

    Base UI

    base-ui.com

    無樣式使用者介面元件，用於建構具備無障礙功能的網頁應用程式與設計系統。

    Floating UI - 建立工具提示、彈出視窗、下拉選單等元件

    Floating UI - 建立工具提示、彈出視窗、下拉選單等元件

    floating-ui.com

    一個用於定位浮動元素並為其建立互動的 JavaScript 函式庫。radix-ui 和 base-ui 皆採用此函式庫。

    Fancy Components

    Fancy Components

    fancycomponents.dev

    Fancy Components 不僅內建多種開箱即用的網頁特效，其整體架構與使用方式也承襲自 shadcn/ui，對熟悉該套件的使用者來說幾乎是無縫上手。

    React Spectrum

    React Spectrum

    react-spectrum.adobe.com

    React Spectrum 是由 Adobe 開發，基於 React Aria 架構的 headless UI 設計系統。它不僅提供完整、無樣式的元件，也有提供各個組件對應的 hooks，讓外部開發者能輕鬆進行客製化。而它的主要貢獻者之一 Devon Govett，更是小編非常崇拜的一位軟體工程師。

    shadcn/ui

    shadcn/ui

    ui.shadcn.com

    shadcn/ui 可以說是 2024 年最火紅的 React 元件庫之一，主打「複製貼上、開箱即用」，讓開發者能快速整合並客製化元件。它建立在 Radix UI 提供的 headless 元件之上，並結合 Tailwind CSS，在開發體驗與設計自由度間取得非常完美的平衡。

    Radix UI

    Radix UI

    radix-ui.com

    這是小編非常喜歡的一套設計系統，常常會參考裡面的元件來學習與設計。它同時也是 @shadcn/ui 底層所採用的 UI 庫。