アイコン

アプリ全体で使用されるアイコンの一覧。

Tabler Icons

アプリ全体で React 向けの Tabler Icons を使用しています。

yarn add @tabler/icons-react

各アイコンをコンポーネントとしてインポートできます。例はこちら：

import { IconArrowLeft } from "@tabler/icons-react";

export const MyComponent = () => {
  return <IconArrowLeft color="red" size={48} />;
};

プロパティ	タイプ	説明	デフォルト
サイズ	数	アイコンの高さと幅（ピクセル単位）	24
カラー	string	アイコンの色	currentColor
ストローク	数	アイコンのストローク幅（ピクセル単位）	2

Tablerアイコンに加えて、アプリにはいくつかのカスタムアイコンも使用されています。

アドレス帳のアイコンを表示します。

import { IconAddressBook } from 'twenty-ui/display';

export const MyComponent = () => {
  return <IconAddressBook size={24} stroke={2} />;
};