coss-particles
Compare original and translation side by side
🇺🇸
Original
English🇨🇳
Translation
ChineseCOSS UI Particles Index
COSS UI Particles 索引
Particles are copy-paste-ready UI patterns built on coss primitives. Browse them visually at https://coss.com/ui/particles.
Particles是基于coss原语构建的可直接复制粘贴的UI模式,你可以在https://coss.com/ui/particles直观浏览所有particle。
How to use this skill
使用指南
- Describe the UI you need (e.g. "a form with validation", "a dialog with a form inside", "tabs with icons").
- Search this index for matching particles by component type and description.
- Fetch the JSON URL to get the full source code of the particle.
- Adapt the particle code to your needs.
- 描述你需要的UI(例如「带校验的表单」、「内嵌表单的弹窗」、「带图标的标签页」)。
- 按组件类型和描述在本索引中搜索匹配的particle。
- 获取JSON链接得到particle的完整源码。
- 根据你的需求适配particle代码。
JSON URL pattern
JSON链接规则
Each particle has a JSON manifest at:
https://coss.com/ui/r/<particle-name>.jsonFor example:
https://coss.com/ui/r/p-accordion-1.json每个particle的JSON清单地址格式如下:
https://coss.com/ui/r/<particle-name>.json示例:
https://coss.com/ui/r/p-accordion-1.jsonSource code
源码地址
Particle source files live in this repo at .
apps/ui/registry/default/particles/Particle的源文件存放在仓库的路径下。
apps/ui/registry/default/particles/Updating this index
更新本索引
Run the generator script from the coss repo root:
bash
node apps/ui/scripts/generate-particle-index.cjsTotal: 474 particles across 52 component types
在coss仓库根目录运行生成脚本:
bash
node apps/ui/scripts/generate-particle-index.cjs总计:覆盖52种组件类型,共474个particle
Component types
组件类型
- accordion (4)
- alert (7)
- alert-dialog (2)
- autocomplete (15)
- avatar (14)
- badge (20)
- breadcrumb (7)
- button (40)
- calendar (24)
- card (11)
- checkbox (5)
- checkbox-group (5)
- collapsible (1)
- combobox (18)
- command (2)
- date-picker (9)
- dialog (6)
- drawer (14)
- empty (1)
- field (18)
- fieldset (1)
- form (2)
- frame (4)
- group (22)
- input (19)
- input-group (28)
- input-otp (7)
- kbd (1)
- menu (9)
- meter (4)
- number-field (11)
- pagination (3)
- popover (3)
- preview-card (1)
- progress (3)
- radio-group (6)
- scroll-area (5)
- select (23)
- separator (1)
- sheet (3)
- skeleton (2)
- slider (23)
- spinner (1)
- switch (6)
- table (4)
- tabs (13)
- textarea (15)
- toast (9)
- toggle (8)
- toggle-group (9)
- toolbar (1)
- tooltip (4)
- accordion (4)
- alert (7)
- alert-dialog (2)
- autocomplete (15)
- avatar (14)
- badge (20)
- breadcrumb (7)
- button (40)
- calendar (24)
- card (11)
- checkbox (5)
- checkbox-group (5)
- collapsible (1)
- combobox (18)
- command (2)
- date-picker (9)
- dialog (6)
- drawer (14)
- empty (1)
- field (18)
- fieldset (1)
- form (2)
- frame (4)
- group (22)
- input (19)
- input-group (28)
- input-otp (7)
- kbd (1)
- menu (9)
- meter (4)
- number-field (11)
- pagination (3)
- popover (3)
- preview-card (1)
- progress (3)
- radio-group (6)
- scroll-area (5)
- select (23)
- separator (1)
- sheet (3)
- skeleton (2)
- slider (23)
- spinner (1)
- switch (6)
- table (4)
- tabs (13)
- textarea (15)
- toast (9)
- toggle (8)
- toggle-group (9)
- toolbar (1)
- tooltip (4)
accordion
accordion
alert
alert
alert-dialog
alert-dialog
autocomplete
autocomplete
- Basic autocomplete | JSON
- Disabled autocomplete | JSON
- Small autocomplete | JSON
- Large autocomplete | JSON
- Autocomplete with label | JSON
- Autocomplete autofilling the input with the highlighted item | JSON
- Autocomplete auto highlighting the first option | JSON
- Autocomplete with clear button | JSON
- Autocomplete with trigger and clear buttons | JSON
- Autocomplete with grouped items | JSON
- Autocomplete with limited number of results | JSON
- Autocomplete with async items loading | JSON
- Autocomplete form | JSON
- Autocomplete form | JSON
- Pill-shaped autocomplete | JSON
- 基础autocomplete | JSON
- 禁用状态autocomplete | JSON
- 小尺寸autocomplete | JSON
- 大尺寸autocomplete | JSON
- 带标签autocomplete | JSON
- 选中项自动填充输入框autocomplete | JSON
- 自动高亮第一个选项autocomplete | JSON
- 带清除按钮autocomplete | JSON
- 带触发按钮和清除按钮autocomplete | JSON
- 选项分组autocomplete | JSON
- 限制结果数量autocomplete | JSON
- 异步加载选项autocomplete | JSON
- Autocomplete表单 | JSON
- Autocomplete表单 | JSON
- 胶囊形autocomplete | JSON
avatar
avatar
- Avatar with image and fallback | JSON
- Fallback-only avatar | JSON
- Avatars with different sizes | JSON
- Avatars with different radii | JSON
- Overlapping avatar group | JSON
- Avatar with user icon fallback | JSON
- Avatar with emerald status dot | JSON
- Avatar with muted status dot | JSON
- Rounded avatar with top-right emerald status | JSON
- Avatar with notification badge | JSON
- Rounded avatar with notification badge | JSON
- Avatar with verified badge | JSON
- Small overlapping avatar group | JSON
- Large overlapping avatar group | JSON
badge
badge
- Basic badge | JSON
- Outline badge | JSON
- Secondary badge | JSON
- Destructive badge | JSON
- Info badge | JSON
- Success badge | JSON
- Warning badge | JSON
- Error badge | JSON
- Small badge | JSON
- Large badge | JSON
- Badge with icon | JSON
- Badge with link | JSON
- Badge with count | JSON
- Full rounded badge (pill) | JSON
- Badge with number after text | JSON
- Status badge - Paid | JSON
- Status badge - Pending | JSON
- Status badge - Failed | JSON
- Selectable badge with checkbox | JSON
- Removable badge | JSON
- 基础badge | JSON
- 描边badge | JSON
- 次要样式badge | JSON
- 危险样式badge | JSON
- 信息样式badge | JSON
- 成功样式badge | JSON
- 警告样式badge | JSON
- 错误样式badge | JSON
- 小尺寸badge | JSON
- 大尺寸badge | JSON
- 带图标badge | JSON
- 带链接badge | JSON
- 带计数badge | JSON
- 全圆角胶囊badge | JSON
- 文本后带数字badge | JSON
- 状态badge - 已支付 | JSON
- 状态badge - 待处理 | JSON
- 状态badge - 失败 | JSON
- 带checkbox的可选择badge | JSON
- 可移除badge | JSON
breadcrumb
breadcrumb
button
button
- Default button | JSON
- Outline button | JSON
- Secondary button | JSON
- Destructive button | JSON
- Destructive outline button | JSON
- Ghost button | JSON
- Link button | JSON
- Extra-small button | JSON
- Small button | JSON
- Large button | JSON
- Extra-large button | JSON
- Disabled button | JSON
- Icon button | JSON
- Small icon button | JSON
- Large icon button | JSON
- Button with icon | JSON
- Link rendered as button | JSON
- Button using the built-in loading prop | JSON
- Custom loading button with manual Spinner | JSON
- Expandable show more/less toggle button | JSON
- Back link button with chevron | JSON
- Card-style button with heading and description | JSON
- Directional pad control buttons | JSON
- Outline like button with count | JSON
- Social login icon buttons | JSON
- Star button with count badge | JSON
- Button group with QR code icon and sign in | JSON
- Button with avatar | JSON
- Pill-shaped button with rounded-full styling | JSON
- Button with animated arrow on hover | JSON
- Button with keyboard shortcut indicator | JSON
- Button with notification badge | JSON
- Paired buttons (Cancel/Save) | JSON
- Button with animated status dot | JSON
- Icon-only copy button with feedback | JSON
- Copy button with feedback | JSON
- Rotating icon button (FAB-style toggle) | JSON
- Hamburger menu button with animated icon | JSON
- Download button with progress and cancel action | JSON
- Social login buttons (Google, X, GitHub) | JSON
- 默认button | JSON
- 描边button | JSON
- 次要button | JSON
- 危险button | JSON
- 危险描边button | JSON
- 幽灵button | JSON
- 链接样式button | JSON
- 超小尺寸button | JSON
- 小尺寸button | JSON
- 大尺寸button | JSON
- 超大尺寸button | JSON
- 禁用状态button | JSON
- 图标button | JSON
- 小尺寸图标button | JSON
- 大尺寸图标button | JSON
- 带图标button | JSON
- 渲染为button的链接 | JSON
- 使用内置loading属性的button | JSON
- 手动引入Spinner的自定义加载button | JSON
- 可展开的显示更多/收起切换button | JSON
- 带返回箭头的链接button | JSON
- 带标题和说明的卡片样式button | JSON
- 方向键控制button | JSON
- 带计数的描边点赞button | JSON
- 社交登录图标button | JSON
- 带计数徽章的星级button | JSON
- 带二维码图标和登录功能的button组 | JSON
- 带avatar的button | JSON
- 全圆角胶囊样式button | JSON
- hover时带动画箭头的button | JSON
- 带快捷键提示的button | JSON
- 带通知徽章的button | JSON
- 配对button(取消/保存) | JSON
- 带动画状态点的button | JSON
- 带操作反馈的仅图标复制button | JSON
- 带操作反馈的复制button | JSON
- 旋转图标button(FAB样式切换) | JSON
- 带动画图标的汉堡菜单button | JSON
- 带进度和取消操作的下载button | JSON
- 社交登录button(Google、X、GitHub) | JSON
calendar
calendar
- Basic calendar | JSON
- Calendar with date range selection | JSON
- Calendar with month/year dropdown navigation | JSON
- Calendar with custom Select dropdown for month/year | JSON
- Calendar with Combobox dropdown for month/year | JSON
- Calendar with disabled dates | JSON
- Calendar with multiple date selection | JSON
- Calendar with custom cell size | JSON
- Calendar with rounded day buttons | JSON
- Calendar with rounded range selection style | JSON
- Calendar with right-aligned navigation | JSON
- Calendar with week numbers | JSON
- Calendar with year-only combobox dropdown | JSON
- Calendar without arrow navigation (dropdown only) | JSON
- Calendar with current month button | JSON
- Calendar with today button | JSON
- Calendar with date input | JSON
- Calendar with time input | JSON
- Calendar with time slots (appointment picker) | JSON
- Calendar with date presets | JSON
- Range calendar with date presets | JSON
- Two months calendar | JSON
- Three months calendar | JSON
- Pricing calendar with custom day buttons | JSON
- 基础calendar | JSON
- 带日期范围选择的calendar | JSON
- 带月/年下拉导航的calendar | JSON
- 自定义月/年Select下拉的calendar | JSON
- 月/年选择使用Combobox下拉的calendar | JSON
- 带禁用日期的calendar | JSON
- 支持多选日期的calendar | JSON
- 自定义单元格尺寸的calendar | JSON
- 日期按钮为圆角的calendar | JSON
- 范围选择样式为圆角的calendar | JSON
- 导航右对齐的calendar | JSON
- 带周数的calendar | JSON
- 仅年选择Combobox下拉的calendar | JSON
- 无箭头导航(仅下拉)的calendar | JSON
- 带回到当月按钮的calendar | JSON
- 带回到今天按钮的calendar | JSON
- 带日期输入框的calendar | JSON
- 带时间输入框的calendar | JSON
- 带时间段(预约选择器)的calendar | JSON
- 带日期预设的calendar | JSON
- 带日期预设的范围选择calendar | JSON
- 双月展示calendar | JSON
- 三月展示calendar | JSON
- 带自定义日期按钮的定价calendar | JSON
card
card
- A basic card with header and footer | JSON
- Authentication card with actions | JSON
- Authentication card with separators | JSON
- Framed card with footer | JSON
- Framed card with header | JSON
- Framed card with header and footer | JSON
- Framed card with no rounded bottom | JSON
- Card within a frame and footer | JSON
- Card within a frame and footer | JSON
- Card within a frame with header and footer | JSON
- CardFrame with header action | JSON
checkbox
checkbox
checkbox-group
checkbox-group
collapsible
collapsible
combobox
combobox
- Basic combobox | JSON
- Disabled combobox | JSON
- Small combobox | JSON
- Large combobox | JSON
- Combobox with label | JSON
- Combobox auto highlighting the first option | JSON
- Combobox with clear button | JSON
- Combobox with grouped items | JSON
- Combobox with multiple selection | JSON
- Combobox with input inside popup | JSON
- Combobox form | JSON
- Combobox multiple form | JSON
- Combobox with start addon | JSON
- Combobox multiple with start addon | JSON
- Pill-shaped combobox | JSON
- Timezone combobox | JSON
- Timezone combobox with search input | JSON
- Combobox with select trigger | JSON
- 基础combobox | JSON
- 禁用状态combobox | JSON
- 小尺寸combobox | JSON
- 大尺寸combobox | JSON
- 带标签combobox | JSON
- 自动高亮第一个选项的combobox | JSON
- 带清除按钮的combobox | JSON
- 选项分组combobox | JSON
- 支持多选的combobox | JSON
- 弹窗内嵌输入框的combobox | JSON
- Combobox表单 | JSON
- 多选combobox表单 | JSON
- 带前置附加内容的combobox | JSON
- 带前置附加内容的多选combobox | JSON
- 胶囊形combobox | JSON
- 时区选择combobox | JSON
- 带搜索输入框的时区选择combobox | JSON
- 带select触发器的combobox | JSON
command
command
date-picker
date-picker
- Basic date picker | JSON
- Date range picker | JSON
- Two months calendar with range date | JSON
- Date picker with field and dropdown navigation | JSON
- Date picker with presets | JSON
- Date picker with input | JSON
- Date picker that closes on select | JSON
- Multiple dates picker | JSON
- Date picker with select-like trigger | JSON
dialog
dialog
drawer
drawer
- Simple bottom drawer with close button | JSON
- Bottom drawer without drag bar | JSON
- Drawer with close button | JSON
- Inset variant drawers for all four positions | JSON
- Straight variant drawers for all four positions | JSON
- Scrollable content with terms and conditions | JSON
- Nested bottom drawers with centered content | JSON
- Nested right drawers with inset variant | JSON
- Bottom drawer with snap points | JSON
- Edit profile form with default and bare footer variants | JSON
- Mobile menu drawer from the left | JSON
- Responsive edit profile: dialog on desktop, drawer on mobile | JSON
- Responsive actions menu: menu on desktop, drawer on mobile | JSON
- Left drawer with swipe area | JSON
- 带关闭按钮的简单底部drawer | JSON
- 无拖动条的底部drawer | JSON
- 带关闭按钮的drawer | JSON
- 四位置内嵌样式drawer | JSON
- 四位置直角样式drawer | JSON
- 带用户协议长可滚动内容的drawer | JSON
- 内容居中的嵌套底部drawer | JSON
- 内嵌样式的嵌套右侧drawer | JSON
- 带停靠高度的底部drawer | JSON
- 支持默认和极简底部栏的编辑资料表单drawer | JSON
- 左侧弹出的移动端菜单drawer | JSON
- 响应式编辑资料:桌面端dialog、移动端drawer | JSON
- 响应式操作菜单:桌面端menu、移动端drawer | JSON
- 带滑动触发区域的左侧drawer | JSON
empty
empty
field
field
- Field with description | JSON
- Field with required indicator | JSON
- Field in disabled state | JSON
- Field showing validation error | JSON
- Show field validity state | JSON
- Input group with field | JSON
- Field with autocomplete | JSON
- Field with combobox | JSON
- Field with multiple selection combobox | JSON
- Field with textarea | JSON
- Field with select | JSON
- Field with checkbox | JSON
- Field with checkbox group | JSON
- Field with radio group | JSON
- Field with toggle switch | JSON
- Field with slider | JSON
- Field with number field | JSON
- Complete form built with field | JSON
- 带描述的field | JSON
- 带必填标识的field | JSON
- 禁用状态field | JSON
- 展示校验错误的field | JSON
- 展示field有效性状态 | JSON
- 带field的输入组 | JSON
- 带autocomplete的field | JSON
- 带combobox的field | JSON
- 带多选combobox的field | JSON
- 带textarea的field | JSON
- 带select的field | JSON
- 带checkbox的field | JSON
- 带checkbox group的field | JSON
- 带radio group的field | JSON
- 带toggle switch的field | JSON
- 带slider的field | JSON
- 带number field的field | JSON
- 基于field构建的完整表单 | JSON
fieldset
fieldset
form
form
frame
frame
group
group
- Basic group | JSON
- Group with input | JSON
- Small group | JSON
- Large group | JSON
- Group with disabled button | JSON
- Group with default button | JSON
- Group with start text | JSON
- Group with end text | JSON
- Vertical group | JSON
- Nested groups | JSON
- Group with popup | JSON
- Group with input group | JSON
- Group with menu | JSON
- Group with select | JSON
- Group with search | JSON
- Group with add button and input | JSON
- Group with input and currency text | JSON
- Group with select and input | JSON
- Group with input and select | JSON
- Group with input and text button | JSON
- Group with two number inputs for range | JSON
- Group with filter label, combobox multi-select, and remove button | JSON
- 基础group | JSON
- 带输入框的group | JSON
- 小尺寸group | JSON
- 大尺寸group | JSON
- 带禁用按钮的group | JSON
- 带默认按钮的group | JSON
- 带前置文本的group | JSON
- 带后置文本的group | JSON
- 垂直group | JSON
- 嵌套group | JSON
- 带弹窗的group | JSON
- 带输入组的group | JSON
- 带menu的group | JSON
- 带select的group | JSON
- 带搜索功能的group | JSON
- 带添加按钮和输入框的group | JSON
- 带输入框和货币文本的group | JSON
- 带select和输入框的group | JSON
- 带输入框和select的group | JSON
- 带输入框和文本按钮的group | JSON
- 带两个数值输入框的范围选择group | JSON
- 带筛选标签、多选combobox和移除按钮的group | JSON
input
input
- Basic input | JSON
- Small input | JSON
- Large input | JSON
- Disabled input | JSON
- File input | JSON
- Input with label | JSON
- Input with button using Group | JSON
- Input with start text and end tooltip | JSON
- Password input with toggle visibility | JSON
- Input group mimicking a URL bar | JSON
- Input group with keyboard shortcut | JSON
- Input group with start loading spinner | JSON
- Input with label and required indicator | JSON
- Input with optional label | JSON
- Input with custom border and background | JSON
- Input group with end loading spinner | JSON
- Read-only input | JSON
- Input with characters remaining counter | JSON
- Pill-shaped input | JSON
- 基础input | JSON
- 小尺寸input | JSON
- 大尺寸input | JSON
- 禁用状态input | JSON
- 文件input | JSON
- 带标签input | JSON
- 基于Group实现的带按钮input | JSON
- 带前置文本和后置tooltip的input | JSON
- 支持显隐切换的密码input | JSON
- 模仿地址栏的input组 | JSON
- 带快捷键提示的input组 | JSON
- 前置带加载spinner的input组 | JSON
- 带标签和必填标识的input | JSON
- 带可选标识标签的input | JSON
- 自定义边框和背景的input | JSON
- 后置带加载spinner的input组 | JSON
- 只读input | JSON
- 带剩余字符计数的input | JSON
- 胶囊形input | JSON
input-group
input-group
- Basic input group | JSON
- Input group with end icon | JSON
- Input group with start text | JSON
- Input group with end text | JSON
- Input group with start and end text | JSON
- Input group with number field | JSON
- Input group with end tooltip | JSON
- Input group with icon button | JSON
- Input group with button | JSON
- Input group with badge | JSON
- Input group with keyboard shortcut | JSON
- Input group with inner label | JSON
- Small input group | JSON
- Large input group | JSON
- Disabled input group | JSON
- Input group with loading spinner | JSON
- Input group with textarea | JSON
- Input group with badge and menu | JSON
- Mini editor built with input group and toggle | JSON
- Input group with search icon | JSON
- Input group with start tooltip | JSON
- Input group with clear button | JSON
- Search input group with loader and voice button | JSON
- Input group with character counter | JSON
- Password input with strength indicator | JSON
- Code snippet input with language selector | JSON
- Message composer with attachment buttons | JSON
- Chat input with voice and send buttons | JSON
- 基础input group | JSON
- 带后置图标的input group | JSON
- 带前置文本的input group | JSON
- 带后置文本的input group | JSON
- 同时带前置和后置文本的input group | JSON
- 带number field的input group | JSON
- 带后置tooltip的input group | JSON
- 带图标按钮的input group | JSON
- 带按钮的input group | JSON
- 带badge的input group | JSON
- 带快捷键提示的input group | JSON
- 带内置标签的input group | JSON
- 小尺寸input group | JSON
- 大尺寸input group | JSON
- 禁用状态input group | JSON
- 带加载spinner的input group | JSON
- 带textarea的input group | JSON
- 带badge和menu的input group | JSON
- 基于input group和toggle构建的迷你编辑器 | JSON
- 带搜索图标的input group | JSON
- 带前置tooltip的input group | JSON
- 带清除按钮的input group | JSON
- 带加载器和语音按钮的搜索input组 | JSON
- 带字符计数的input group | JSON
- 带强度指示器的密码input | JSON
- 带语言选择器的代码片段input | JSON
- 带附件按钮的消息输入框 | JSON
- 带语音和发送按钮的聊天输入框 | JSON
input-otp
input-otp
kbd
kbd
menu
menu
meter
meter
number-field
number-field
- Basic number field | JSON
- Small number field | JSON
- Large number field | JSON
- Disabled number field | JSON
- Number field with label | JSON
- Number field with scrub | JSON
- Number field with range | JSON
- Number field with formatted value | JSON
- Number field with step | JSON
- Number field in form | JSON
- Pill-shaped number field | JSON
pagination
pagination
popover
popover
preview-card
preview-card
progress
progress
radio-group
radio-group
scroll-area
scroll-area
select
select
- Basic select | JSON
- Small select | JSON
- Large select | JSON
- Disabled select | JSON
- Select without item alignment | JSON
- Select with groups | JSON
- Multiple select | JSON
- Select with icon | JSON
- Select options with icon | JSON
- Select with object values | JSON
- Select with disabled items | JSON
- Timezone select | JSON
- Status select with colored dot | JSON
- Pill-shaped select trigger | JSON
- Select with left text label | JSON
- Select with country flags | JSON
- Select with description in options only | JSON
- Select with avatars | JSON
- Rich select with avatars and usernames | JSON
- Auto width select | JSON
- Select with custom border and background | JSON
- Select with label | JSON
- Select in form | JSON
- 基础select | JSON
- 小尺寸select | JSON
- 大尺寸select | JSON
- 禁用状态select | JSON
- 无选项对齐的select | JSON
- 选项分组select | JSON
- 多选select | JSON
- 带图标的select | JSON
- 选项带图标的select | JSON
- 支持对象值的select | JSON
- 带禁用项的select | JSON
- 时区选择select | JSON
- 带彩色状态点的状态选择select | JSON
- 胶囊形select触发器 | JSON
- 带左侧文本标签的select | JSON
- 带国家国旗的select | JSON
- 仅选项带描述的select | JSON
- 带avatar的select | JSON
- 带avatar和用户名的富样式select | JSON
- 自适应宽度select | JSON
- 自定义边框和背景的select | JSON
- 带标签的select | JSON
- 表单中的select | JSON
separator
separator
sheet
sheet
skeleton
skeleton
slider
slider
- Basic slider | JSON
- Slider with label and value | JSON
- Disabled slider | JSON
- Slider with reference labels | JSON
- Slider with ticks | JSON
- Slider with labels above | JSON
- Range slider | JSON
- Slider with 3 thumbs | JSON
- Range slider with collision behavior none | JSON
- Range slider with collision behavior swap | JSON
- Slider with icons | JSON
- Slider with input | JSON
- Range slider with inputs | JSON
- Slider with increment and decrement buttons | JSON
- Price range slider | JSON
- Emoji rating slider | JSON
- Vertical slider | JSON
- Vertical range slider | JSON
- Vertical slider with input | JSON
- Equalizer with vertical sliders | JSON
- Object position sliders with reset | JSON
- Price slider with histogram | JSON
- Slider in form | JSON
- 基础slider | JSON
- 带标签和数值的slider | JSON
- 禁用状态slider | JSON
- 带参考标签的slider | JSON
- 带刻度的slider | JSON
- 标签在上方的slider | JSON
- 范围选择slider | JSON
- 3个滑块的slider | JSON
- 滑块无碰撞限制的范围slider | JSON
- 滑块碰撞可交换位置的范围slider | JSON
- 带图标的slider | JSON
- 带输入框的slider | JSON
- 带输入框的范围slider | JSON
- 带增减按钮的slider | JSON
- 价格范围slider | JSON
- 表情评分slider | JSON
- 纵向slider | JSON
- 纵向范围slider | JSON
- 带输入框的纵向slider | JSON
- 基于纵向slider实现的均衡器 | JSON
- 带重置功能的对象位置slider | JSON
- 带直方图的价格slider | JSON
- 表单中的slider | JSON
spinner
spinner
switch
switch
table
table
tabs
tabs
- Basic tabs | JSON
- Tabs with underline | JSON
- Vertical tabs | JSON
- Vertical tabs with underline | JSON
- Tabs with full rounded triggers | JSON
- Tabs with icon before name | JSON
- Tabs with icon before name and underline | JSON
- Tabs with icon only | JSON
- Tabs with underline and icon on top | JSON
- Tabs with count badge | JSON
- Vertical tabs with underline and icon before name | JSON
- Tabs with icon only and count badge | JSON
- Tabs with icon only and grouped tooltips | JSON
textarea
textarea
- Basic textarea | JSON
- Small textarea | JSON
- Large textarea | JSON
- Disabled textarea | JSON
- Textarea with label | JSON
- Textarea in form | JSON
- Textarea with label and required indicator | JSON
- Textarea with optional label | JSON
- Textarea with custom border and background | JSON
- Read-only textarea | JSON
- Textarea with characters remaining counter | JSON
- Textarea field with required indicator | JSON
- Shorter textarea with fixed height | JSON
- Textarea with button aligned right | JSON
- Textarea with button aligned left | JSON
- 基础textarea | JSON
- 小尺寸textarea | JSON
- 大尺寸textarea | JSON
- 禁用状态textarea | JSON
- 带标签的textarea | JSON
- 表单中的textarea | JSON
- 带标签和必填标识的textarea | JSON
- 带可选标识标签的textarea | JSON
- 自定义边框和背景的textarea | JSON
- 只读textarea | JSON
- 带剩余字符计数的textarea | JSON
- 带必填标识的textarea field | JSON
- 固定高度的短textarea | JSON
- 按钮右对齐的textarea | JSON
- 按钮左对齐的textarea | JSON