> ## Documentation Index
> Fetch the complete documentation index at: https://docs.coze.cn/llms.txt
> Use this file to discover all available pages before exploring further.

搭建网页端用户界面，支持使用多种类型组件，例如输入组件、展示组件和布局组件，每一类组件包含多个不同的组件。
<!-- @cols-width: 100,113,642 -->
| | | | \
|**组件分类** |**组件名称** |**说明** |
|---|---|---|
| | | | \
|布局组件 |[纵向列表](/guides/list_web) |用于展示数据项的列表视图。 |
|^^| | | \
| |[横向列表](/guides/horizontal_list_web) |用于纵向展示数据项的列表视图。 |
|^^| | | \
| |[宫格列表](/guides/grid_list_web) |用于以瀑布流形式展示数据项的列表视图。 |
|^^| | | \
| |[瀑布流列表](/guides/waterfall_list_web) |用于以宫格形式展示数据项的列表视图。 |
|^^| | | \
| |[容器](/guides/container_web) |用于包含和对齐一组子组件，是构建复杂布局的基础。 |
| | | | \
|展示组件 |[文本](/guides/text_web) |用于显示静态文本内容。 |
|^^| | | \
| |[徽章](/guides/badge_web) |用于展示通知或重要信息的小组件，常带有数字或图标。 |
|^^| | | \
| |[图标](/guides/icon_web) |用于展示图标，增强界面的视觉效果和交互性。 |
|^^| | | \
| |[代码展示器](/guides/code_showcaser_web) |用于显示代码片段。 |
|^^| | | \
| |[Markdown](/guides/markdown_web) |用于渲染 Markdown 格式的文本。 |
|^^| | | \
| |[图片](/guides/image_web) |用于展示图片。 |
|^^| | | \
| |[Lottie 动画](/guides/lottie_web) |用于展示 Lottie 动画。 |
|^^| | | \
| |[视频](/guides/video_web) |用于播放视频。 |
| | | | \
|输入组件 |[按钮](/guides/button_web) |用于触发事件或动作，例如提交表单。 |
|^^| | | \
| |[表单](/guides/form_web) |用于收集用户输入的数据，通常与多个输入字段一起使用。 |
|^^| | | \
| |[开关](/guides/switch_web) |用于开启或关闭某个选项，常用于设置。 |
|^^| | | \
| |[文本输入](/guides/text_input_web) |用于接收用户文本输入的字段，允许用户输入、编辑文本信息。 |
|^^| | | \
| |[下拉选择](/guides/drop-down_selection_web) |用于从预定义的选项列表中选择一个选项。 |
|^^| | | \
| |[代码编辑](/guides/code_editor_web) |用于编写代码，支持语法高亮和代码提示。 |
|^^| | | \
| |[数字输入](/guides/numeric_Input_web) |用于输入数字，适用于需要精确数值的场景。 |
|^^| | | \
| |[文件上传](/guides/file_upload_web) |用于上传文件，支持配置上传文件的格式和大小。 |
|^^| | | \
| |[图片上传](/guides/image_upload_web) |用于上传和展示图片，常用于图像内容的管理。 |
| | | | \
|AI 组件 |[AI 对话](/guides/ai_chat_web) |用于搭建对话式 AI 应用，支持绑定对话流、设置开场白和快捷指令。 |