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

# 概览

> Twenty CRM 的组件库

export const CardTitle = ({children}) => {
  return <div className="text-base font-semibold text-gray-900 dark:text-gray-100">
      {children}
    </div>;
};

## 组件

<CardGroup cols={2}>
  <Card href="/l/zh/twenty-ui/display" img="https://mintcdn.com/twenty/GMeQVDsw5ST_LXpE/images/user-guide/views/filter.png?fit=max&auto=format&n=GMeQVDsw5ST_LXpE&q=85&s=457ca3d2bad4bdf406ab6b01f22e0bf2" width="1440" height="680" data-path="images/user-guide/views/filter.png">
    <CardTitle>显示</CardTitle>
    用于直观显示信息的显示组件
  </Card>

  <Card href="/l/zh/twenty-ui/progress-bar" img="https://mintcdn.com/twenty/JIRRbviz5phT8G2L/images/user-guide/fields/field.png?fit=max&auto=format&n=JIRRbviz5phT8G2L&q=85&s=d05539b92dcec1953026ba95f2bfe07d" width="1440" height="680" data-path="images/user-guide/fields/field.png">
    <CardTitle>反馈</CardTitle>
    用户通知的反馈组件
  </Card>

  <Card href="/l/zh/twenty-ui/input" img="https://mintcdn.com/twenty/GMeQVDsw5ST_LXpE/images/user-guide/tips/light-bulb.png?fit=max&auto=format&n=GMeQVDsw5ST_LXpE&q=85&s=2801cd9b03d8ff39bb24472e0311f540" width="1440" height="680" data-path="images/user-guide/tips/light-bulb.png">
    <CardTitle>输入</CardTitle>
    用于用户交互的输入组件
  </Card>

  <Card href="/l/zh/twenty-ui/navigation" img="https://mintcdn.com/twenty/GMeQVDsw5ST_LXpE/images/user-guide/tasks/tasks_header.png?fit=max&auto=format&n=GMeQVDsw5ST_LXpE&q=85&s=4c4e26ebbb9b40e541a945a9cda7c28a" width="1440" height="680" data-path="images/user-guide/tasks/tasks_header.png">
    <CardTitle>导航</CardTitle>
    用于用户界面的导航组件
  </Card>
</CardGroup>