検索

メニュー

お知らせ （ デザインデータ ）

最新のFigmaデータはFigma Communityで提供しています。

  • デザインデータ（Figma）v2.18.1を公開しました。

    v2.18.1の更新内容
    水平メニュー
    • Defaultステートのウェイトを細字に変更
    • Sub menu: openのウェイトを太字および下ボーダーを表示
    メガメニュー
    • コンポーネントから閉じるボタンを削除
    • オーバーレイシェードを削除
    • 外周の色をBlackからGray-420に変更
    • 装飾付きの作例を追加
    • チップ付き見出しの作例の閉じるボタンの付け方を変更
    • 水平メニューと組み合わせた作例を修正
    「v2.18.1の更新内容」の先頭に戻る

  • デザインデータ（Figma）v2.18.0を公開しました。

    v2.18.0の更新内容
    メガメニュー
    • 初版公開
    モーダルダイアログ
    • 作例を修正
    「v2.18.0の更新内容」の先頭に戻る

  • デザインデータ（Figma）v2.17.1を公開しました。

    v2.17.1の更新内容
    コンポーネント：パンくずナビゲーション
    • パンくずリストからパンくずナビゲーションに名称を変更
    「v2.17.1の更新内容」の先頭に戻る

  • デザインデータ（Figma）v2.17.0を公開しました。

    v2.17.0の更新内容
    基本デザイン：カラー
    • 機能カラーにフォーカスカラーおよび検索ハイライトカラーを追加
    スタイルガイド
    • 基本デザインのページに統合
    「v2.17.0の更新内容」の先頭に戻る

  • デザインデータ（Figma）v2.16.0を公開しました。

    v2.16.0の更新内容
    アコーディオン
    • 各作例を実際の利用ケースに近い形に調整
    インプットテキスト
    • ラベルとインプットフィールドを横並びに配置する作例を追加
    チップラベル
    • 文章やタイトルの冒頭にチップラベルが表示される作例を追加
    注釈ブロック
    • 初版公開
    ディスクロージャー
    • 各作例を実際の利用ケースに近い形に調整
    テーブル／データテーブル
    • 各作例に外周の枠線を追加
    「v2.16.0の更新内容」の先頭に戻る

  • デザインデータ（Figma）v2.15.0を公開しました。

    v2.15.0の更新内容
    基本デザイン：アイコン
    • Icon Close Button、Text Close Button追加
    目次
    • 初版公開
    モーダルダイアログ
    • 初版公開
    スイッチ
    • 初版公開
    「v2.15.0の更新内容」の先頭に戻る

  • デザインデータ（Figma）v2.14.1を公開しました。

    v2.14.1の更新内容
    チップラベル
    • アウトラインスタイルの背景色をWhiteに設定
    • Style名称を変更
    「v2.14.1の更新内容」の先頭に戻る

  • デザインデータ（Figma）v2.14.0を公開しました。

    v2.14.0の更新内容
    スタイルガイド
    • 初版公開
    アコーディオン
    • 色の参照をキーカラーに変更
    カード
    • 色の参照をキーカラーに変更
    カルーセル
    • 色の参照をキーカラーに変更
    検索ボックス
    • 色の参照をキーカラーに変更
    コンボボックス
    • 色の参照をキーカラーに変更
    水平メニュー
    • 「グローバルメニュー」から名称変更
    • 色の参照をキーカラーに変更
    タブ
    • 色の参照をキーカラーに変更
    チェックボックス
    • 色の参照をキーカラーに変更
    チップタグ
    • 色の参照をキーカラーに変更
    ディスクロージャー
    • 色の参照をキーカラーに変更
    テーブルコントロール
    • 色の参照をキーカラーに変更
    テーブル／データテーブル
    • 色の参照をキーカラーに変更
    ファイルアップロード／ドロップエリア
    • 色の参照をキーカラーに変更
    日付ピッカー／カレンダー
    • 色の参照をキーカラーに変更
    プログレスインジケーター
    • 色の参照をキーカラーに変更
    ページナビゲーション
    • 色の参照をキーカラーに変更
    ボタン
    • 色の参照をキーカラーに変更
    見出し
    • 色の参照をキーカラーに変更
    メニューリスト
    • 色の参照をキーカラーに変更
    モバイルメニュー
    • 色の参照をキーカラーに変更
    ラジオボタン
    • 色の参照をキーカラーに変更
    リソースリスト
    • 色の参照をキーカラーに変更
    「v2.14.0の更新内容」の先頭に戻る

  • デザインデータ（Figma）v2.13.0を公開しました。

    v2.13.0の更新内容
    検索ボックス
    • サイズのバリエーションを追加
    コンボボックス
    • 初版公開
    「v2.13.0の更新内容」の先頭に戻る

  • デザインデータ（Figma）v2.12.0を公開しました。

    v2.12.0の更新内容
    画像
    • 初版公開
    テーブル／データテーブル
    • 選択中の行の塗りを、セパレーターを追加した塗りの表現に変更
    「v2.12.0の更新内容」の先頭に戻る

  • デザインデータ（Figma）v2.11.1を公開しました。

    v2.11.1の更新内容
    アコーディオン
    • 高さのバラつきを修正
    • レイヤー構造を整理
    テーブルコントロール
    • ページ数のバリエーションを満たすように作例を修正
    ページナビゲーション
    • Textタイプの前後ボタンの高さを「ボタン」コンポーネントのMediumに合わせるかたちで、40pxから48pxに変更
    「v2.11.1の更新内容」の先頭に戻る

  • デザインデータ（Figma）v2.11.0を公開しました。

    v2.11.0の更新内容
    コンポーネント
    • 「タブ」コンポーネントを新規追加
    「v2.11.0の更新内容」の先頭に戻る

  • デザインデータ（Figma）v2.10.3を公開しました。

    v2.10.3の更新内容
    コンポーネント
    • プログレスインジケーター
      • 意匠を変更して、作例を調整
    • ボタン
      • X-Smallの高さを28pxに修正
      • 一部バリアントにあった不整合を修正
    「v2.10.3の更新内容」の先頭に戻る

  • デザインデータ（Figma）v2.10.2を公開しました。

    v2.10.2の更新内容
    コンポーネント
    • 箇条書きリスト
      • コンポーネント名を「リスト」から「箇条書きリスト」に変更
      • インデントのバリエーションを0、32、64の3種類に変更
      • 項番を左揃えに変更
      • 項番のバリエーションを拡充
    • カルーセル
      • 打ち出しタイプ-シングル、および作例を追加
    • グローバルメニュー
      • Selected : Focusのステートを追加
    「v2.10.2の更新内容」の先頭に戻る

  • デザインデータ（Figma）v2.10.1を公開しました。

    v2.10.1の更新内容
    コンポーネント
    • ファイルアップロード
      • 削除ボタンのラベルを「解除」に変更
      • ファイル選択サマリーを追加
    「v2.10.1の更新内容」の先頭に戻る

  • デザインデータ（Figma）v2.10.0を公開しました。

    v2.10.0の更新内容
    コンポーネント
    • 「カルーセル」コンポーネントを新規追加
    • 「ファイルアップロード／ドロップエリア」コンポーネントを新規追加
    • インプットテキスト
      • Input Text Unitsに含まれるInput Textの幅をFillに変更
      • エラーテキストに誤って指定されていたStrokeを削除
    • テキストエリア
      • Text Area Unitsに含まれるText Area Fieldsの幅をFillに変更
      • エラーテキストと文字数カウンターのレイアウトを変更
      • エラーテキストと文字数カウンターに誤って指定されていたStrokeを削除
    • リソースリスト
      • インタラクションをInlineまたはWholeから選べるようにする
      • WholeタイプのDisabled時にリソースリスト全体をグレーアウトする
      • Action Buttonをコンポーネント化
      • Frame Styleで角丸ではない作例を追加
      • 外枠の色をOpacityGrayからSolidGrayに変更
      • Selected時外枠の色をGray-500に変更
    「v2.10.0の更新内容」の先頭に戻る

  • デザインデータ（Figma）v2.9.0を公開しました。

    v2.9.0の更新内容
    コンポーネント
    • 「ステップナビゲーション」コンポーネントを新規追加
    「v2.9.0の更新内容」の先頭に戻る

  • デザインデータ（Figma）v2.8.1を公開しました。

    v2.8.1の更新内容
    基本デザイン
    • カラー
      • リンクテキストカラーの組み合わせスタイルの例におけるActive時の色をOrange-700からOrange-800に変更
    • リンクテキスト
      • リンクのActive時の色をOrange-700からOrange-800に変更
    コンポーネント
    • パンくずリスト
      • リンクのActive時の色をOrange-700からOrange-800に変更
    「v2.8.1の更新内容」の先頭に戻る

  • デザインデータ（Figma）v2.8.0を公開しました。

    v2.8.0の更新内容
    コンポーネント
    • 「テーブルコントロール」コンポーネントを新規追加
    • 「ページナビゲーション」コンポーネントを新規追加
    「v2.8.0の更新内容」の先頭に戻る

  • デザインデータ（Figma）v2.7.0を公開しました。

    v2.7.0の更新内容
    コンポーネント
    • インプットテキスト
      • Readonlyステートを追加
    • 日付ピッカー
      • Readonlyステートを追加
    • テキストエリア
      • Readonlyステートを追加
    • フォームコントロールラベル
      • 要否ラベルに「編集不可」および「無効」を追加
    • 「チップタグ」コンポーネントを新規追加
    「v2.7.0の更新内容」の先頭に戻る

  • デザインデータ（Figma）v2.6.0を公開しました。

    v2.6.0の更新内容
    コンポーネント
    • 検索ボックス
      • 作例の表示要素を調整
    • ハンバーガーメニューボタン
      • Desktop & Mobile Buttonのパディングを調整
    • ノティフィケーションバナー
      • 閉じるボタンのサイズおよびホバー時のスタイルをハンバーガーメニューボタンに統一
      • デスクトップおよびモバイルの閉じるボタンを横組みのものに統一
      • コンパクトタイプの閉じるボタンのアイコンを「閉じる」ラベル付きのものに変更
      • コンパクトタイプの閉じるボタンの作例を追加
    • ユーティリティーリンク
      • テールアイコンを12pxから16pxに修正
    • 「チップラベル」コンポーネントを新規追加
    「v2.6.0の更新内容」の先頭に戻る

  • デザインデータ（Figma）v2.5.1を公開しました。

    v2.5.1の更新内容
    コンポーネント
    • メニューリスト
      • Smallサイズの高さを36pxに統一
      • 左パディングを16px、右パディングを12pxに統一
      • インデントのバリアントを削除
      • レイヤー構造を整理
      • 作例をアップデート
    • メニューリストボックス
      • メニューリストの更新にともない、メニューリストボックスの作例をアップデート
    • ランゲージセレクター
      • メニューリストの更新にともない、ランゲージセレクターの作例をアップデート
    「v2.5.1の更新内容」の先頭に戻る

  • デザインデータ（Figma）v2.5.0を公開しました。

    v2.5.0の更新内容
    コンポーネント
    • テーブル／データテーブル
      • ソートアイコンの形状を変更し、ソート可能な列のヘッダーセルに常に表示する
      • ヘッダーセルの背景色をGray-50からGray-100に変更
      • ヘッダーセルの罫線色をGray-420からGray-500に変更
      • ストライプ表示、ホバーハイライト、行の選択を含むテーブルの罫線色をGray-420からGray-500に変更
      • ストライプ表示の背景色をGray-50に設定
      • セル内のテキストおよびアイコンの位置を上寄せに変更
      • インデント付き行を含む作例を追加
    • 「検索ボックス」コンポーネントを新規追加
    「v2.5.0の更新内容」の先頭に戻る

  • デザインデータ（Figma）v2.4.0を公開しました。

    v2.4.0の更新内容
    コンポーネント
    • 「リソースリスト」コンポーネントを新規追加
    「v2.4.0の更新内容」の先頭に戻る

  • デザインデータ（Figma）v2.3.0を公開しました。

    v2.3.0の更新内容
    基本デザイン
    • タイポグラフィ
      • Displayテキストスタイルに太さレベルBを追加
    コンポーネント
    • 「日付ピッカー」コンポーネントを新規追加
    • 「プログレスインジケーター」コンポーネントを新規追加
    • 「見出し」コンポーネントを新規追加
    「v2.3.0の更新内容」の先頭に戻る

  • デザインデータ（Figma）v2.2.0を公開しました。

    v2.2.0の更新内容
    コンポーネント
    • 「カード」コンポーネントを新規追加
    「v2.2.0の更新内容」の先頭に戻る

  • デザインデータ（Figma）v2.1.3を公開しました。

    v2.1.3の更新内容
    コンポーネント
    • ボタン
      • 作例を追加
    • 「テーブル／データテーブル」コンポーネントを新規追加
    「v2.1.3の更新内容」の先頭に戻る

  • デザインデータ（Figma）v2.1.2を公開しました。

    v2.1.2の更新内容
    コンポーネント
    • 緊急時バナー
      • 仕様を変更（バナータイトル、クリッカブルエリア）
    「v2.1.2の更新内容」の先頭に戻る

  • デザインデータ（Figma）v2.1.1を公開しました。

    v2.1.1の更新内容
    コンポーネント
    • ドロワー
      • モーダルに限定した仕様として整理したため、下タイプ（モードレス）を削除
    「v2.1.1の更新内容」の先頭に戻る

  • デザインデータ（Figma）v1.4.3に記載のガイドラインを、デザインシステム本体（本ウェブサイト）に掲載しました。

  • デザインデータ（Figma）v2.1.0を公開しました。

    v2.1.0の更新内容
    全体
    • 各コンポーネントをページ化
    コンポーネント
    • アコーディオン
      • 開閉アイコンが文頭に配置されるコンポーネントをデフォルトに設定
      • 閉用アイコンのミディアム、エクストラスモールサイズを追加
      • すべてのコンポーネントのパディングを調整・変更
      • アコーディオン展開時のリターンリンクを追加
    • メニューリストボックス
      • 「ガイドラインを見る」のリンクURLを修正
    • 「ディスクロージャー」コンポーネントを新規追加
    「v2.1.0の更新内容」の先頭に戻る

  • デザインデータ（Figma）v2.0.4を公開しました。

    v2.0.4の更新内容
    全体
    • Color、Size、TypographyのLocal variablesを設定
    基本デザイン
    • アイコン
      • arrow_upwardのスモール、arrow_downward、drag_indicator、errorアイコンを追加
      • ステートを含むアイコンをAction Iconとして追加
    • カラー
      • Color stylesをすべてLocal variablesに変更
    • リンクテキスト
      • Local styles内のText stylesに「Link」を追加
    コンポーネント
    • チェックボックス
      • hover時の表現を変更（グレーボーダーを追加）
    • ドロワー
      • 下タイプ（モードレス）を追加
    • ボタン
      • ボタンバリアブルを統合し、Styleプロパティを追加。各スタイルはStyleプロパティより変更、選択が可能となります。
      • コンポーネント内のAuto layout設定を変更
      • テキストボタン、hover時の下線ウェイトを変更
      • 下線付きのテキストにローカルライブラリーを適用
    • メニューリストボックス
      • メニューリストボックスの上下左右マージンを24 CSS pxに変更
    • メニューリスト
      • Menu List ItemsのWith Thumbnailにボーダー有無のバリアントを追加
      • Boxed / Menu List Itemsコンポーネントの左右のマージンを24 CSS pxに変更
      • Boxed / Menu List Items（With Thumbnailを除く）コンポーネントのバリアントを統合し、サイズプロパティを追加
      • Category Titleのインデントを追加し、16、24、32、40、48、56に変更
    • ラジオボタン
      • hover時の表現を変更（グレーボーダーを追加）
    • ランゲージセレクター
      • メニューリストボックスとメニューリストの変更を同コンポーネントに反映
    • 「リスト」コンポーネントを新規追加
    「v2.0.4の更新内容」の先頭に戻る

  • デザインデータ（Figma）v2をアップデートしました。アップデート内容は各Figma内の更新履歴をご参照ください。

  • デザインデータ（Figma）v2をアップデートしました。アップデート内容は各Figma内の更新履歴をご参照ください。

  • デザインデータ（Figma）v2とv1をアップデートしました。アップデート内容は各Figma内の更新履歴をご参照ください。

  • デザインデータv2.0.0を公開しました。

    v2.0.0の紹介（従来のデザインシステムv1.4.2からの主な変更点）
    全体
    • 今後は専用サイトでコンテンツ展開するため、Figma内に記載されていた「利用の手引き」、「ガイドライン」、およびPagesから「テンプレート」を削除
    • 「スタイル（Style）」としていたPagesの名前を「基本デザイン（foundations）」に変更
    • アクセシビリティ確保のため、デザインシステムの方針としてフォントサイズは16px以上を求めているため、Figma内でのテキストのフォントサイズを原則16px以上に設定
    • フォーカス状態の視認性向上のため、フォーカスインジケーターのスタイルを変更
    • フォーカスインジケーターのスタイル変更にともない、カラートークンのうちFocus-BlueとFocus-Yellowを削除
    • リンクの視認性向上のため、「ユーティリティリンク」のDefaultステートおよびVisitedステートにUnderlineを追加
    • コントラスト要件を満たすため、「リンクテキスト」のHoverステートのスタイルにおいて、Defaultに対してbackground-colorを変化させていたのを取りやめ、underlineの太さを変化させるように変更
    • ディスレクシア対応のため、ベースとなるテキストカラーをGrey-900からGrey-800に変更
    • FigmaのColor stylesを新カラートークンのみの構成に変更（移行用で保持していた旧カラートークンを削除）
    • FigmaのText stylesを新タイポグラフィトークンのみの構成に変更（移行用で保持していた旧タイポグラフィトークンを削除）
    • FigmaのGrid stylesに基本デザイン「レイアウト」の内容を追加
    • イラストレーションアセットをデザインデータから分離（イラストレーションアセットは引き続きDS1内からご参照ください）
    「v2.0.0の紹介（従来のデザインシステムv1.4.2からの主な変更点）」の先頭に戻る

    従来のデザインシステムv1.4.1におけるアクセシビリティ上の重要な問題点を含む各種修正を実施し、v1.4.2として公開しました。

    v1.4.1からv1.4.2へのコンポーネントの修正内容
    コンポーネント
    • 色覚多様性を考慮し、識別性を高めるため、フォームコントロールの「必須」ラベルの接頭辞として「※」（米印、U+203B Reference Mark）を追加
    • 色覚多様性を考慮し、識別性を高めるため、フォームコントロールの「エラーテキスト」の文頭に「＊」（アスタリスク、U+FF0A Fullwidth Asterisk）を追加
    • 「テキスト入力」、「テキストエリア」、「セレクター」、「ラジオボタン」、「チェックボックス」の「必須」ラベルの文字サイズ、および「ラジオボタン」、「チェックボックス」に関してはラベル自体のフォントサイズが、それぞれ14px・12pxになっていたため、すべて16pxに修正
    • 「ノティフィケーションバナー」内の「情報提示 2（Info）」のボーダーおよびアイコンのカラーを黒（Black）からグレー（Solid Grey-536）へ変更
    • 「ノティフィケーションバナー」内の「バナーデスクリプション」を任意要素に変更
    「v1.4.1からv1.4.2へのコンポーネントの修正内容」の先頭に戻る