← 返回首页

Navigation

p-tabs — Tab navigation

Overview
Overview Panel — This is the overview content. papyrai-ui is a framework-agnostic Web Components library.
Components
Components Panel — 136 components across AI, SVG, Elements, Inputs, Navigation, Overlays, Layout and Data.
Docs
Docs Panel — Full documentation powered by VitePress, available in Chinese and English.
Light
Light theme content.
Dark
Dark theme content.
Auto
Auto theme content.

p-pagination — Page navigation

p-steps — Step indicator

p-progress — Progress indicator

p-bottom-tabs — Mobile bottom tab bar

Mobile content area

p-command-palette — Command palette (⌘K)

Click the button or press Cmd+K / Ctrl+K

p-dock — macOS-style magnifying dock

p-scroll-spy — Scroll position tracker

Introduction

papyrai-ui is a paper-style Web Components library. Scroll down to see more sections.

Installation

Install via npm: npm install papyrai-ui

Usage

Import any component and use it as a Web Component in your HTML.

Theming

All components use CSS variables for theming. Set data-theme="dark" for dark mode.

p-scroll-top — Back to top button

The floating button appears after scrolling down 300px (shown below for demo):

p-vertical-navigation — Sidebar navigation