Pepabo Design

Components

App Bar アプリケーションの最上位に配置される Header です。
Avatar 対象のオブジェクトがユーザー（人）に関するものであることを示すための、円形を基本とした画像コンポーネントです。
Bottom Navigation 画面の下部に 3〜5 つの最上位の遷移先を表示するナビゲーションコンポーネントです。
Breadcrumb サイトの全体構造と現在位置の関係を、ホームを起点とした階層表現によって示すナビゲーション系のコンポーネントです。
Button ユーザーが押すことで機能やアクションを発動するためのインタラクティブな UI 要素です。
Callout ユーザーに対して重要かつ簡潔な情報を効果的に伝え、必要に応じて行動を促すためのコンポーネントです。
Card ある情報のチャンク（塊）を、枠線や背景・影などの視覚的なスタイルで囲って表現するコンポーネントです。
Cell List、Description List、Table、Interactive List、Interactive Table などのプロトタイプ（基底）として機能するコンポーネントです。
Checkbox 基本的に ON または OFF（true または false）の値を持ち、2つの値から1つを選択・切り替えるのに使うコンポーネントです。
Chip ラベルのような見た目でユーザーのインタラクションを受け付けるコンポーネントです。
Container コンテンツの領域を示すコンポーネントです。
Description List Key と Value のペアの集合を説明リストとして表示するコンポーネントです。
Dialog ユーザーの操作に介入して、操作実行の確認などを行う対話型のコンポーネントです。
Form 入力や変更などデータ操作のインタラクションを行う UI のパターンです。
Grid コンテンツを行と列に分割してレイアウトするためのコンポーネントです。
Header メジャースタック系コンポーネント（Dialog、Navigation Drawer、Sheet）の画面上部に配置するヘッダーコンポーネントです。
Interactive List 商品やユーザーなど、あるオブジェクトの集合と Interactive にやりとりするためのリストコンポーネントです。
Interactive Table 商品やユーザーなど、あるオブジェクトの集合と Interactive にやりとりするための Table コンポーネントです。
List あるオブジェクトの集合を順序なしリスト（unordered list）または順序つきリスト（ordered list）として表示するコンポーネントです。
Navigation Drawer モバイルや小型タブレットなどの小さな画面で、Bottom Navigation に収まらない優先順位の低い遷移先を格納するドロワー型のナビゲーションコンポーネントです。
Progress Indicator アプリケーションの読み込み、フォームの送信、更新の保存など、進行中のプロセスのステータスをユーザーに通知するコンポーネントです。
Radio 一般的にラジオボタン（ラジオボタングループ）と呼ばれ、複数の項目から1つだけ選択するコンポーネントです。
Scrim ページのコンテンツより上の面に重ねて表示する幕のコンポーネントです。
Select 複数の選択肢から一つを選ぶための入力要素です。
Side Navigation デスクトップや大型タブレットなどの大きな画面で、横方向の画面遷移を提供するナビゲーションコンポーネントです。
Skeleton 画面の読み込み中であることを、読み込み完了後に表示される要素の形状を模したプレースホルダーとして示すコンポーネントです。
Snackbar システムが実行した結果をユーザーに一時的にフィードバックするコンポーネントです。
Sticker オブジェクト（メインの情報）に対する付加的な情報を表示するコンポーネントです。
Tab コンテンツを特定の条件で分類し個々にラベルを付けて、ユーザーが選択した項目に紐付くコンテンツのみを表示するコンポーネントです。
Table 商品やユーザーなど、同じ種類のオブジェクトの集合を構造化して表示するコンポーネントです。
Textfield UI にテキストを入力したいときに使うコンポーネントです。
Thumbnail 対象のオブジェクトを画像を通して理解するのを助けるコンポーネントです。
Validation Message フォーム入力の検証結果をユーザーに伝えるテキストコンポーネントです。