リファレンステーマ

テーマを使用すると、CSS に関する深い知識がなくてもフォームのスタイルを設定できます。デフォルトのテーマに加えて、AEM Formsアドオンパッケージをインストールすることで、次のテーマを取得できます。

  • Beryl
  • Exec
  • Exec-Light
  • Liberty
  • Ultramarine
  • Urbane
  • U.S. Web Design Standards
  • Tranquil

各テーマには、独自のエレガントなスタイルが含まれていて、ユーザー向けの使いやすいアダプティブフォームの作成に使用できます。パネル、テキストボックス、数値ボックス、ラジオボタン、表、スイッチなど、セレクター用の独自のスタイル設定が含まれています。これらのテーマ内のスタイルは、要件に基づいています。たとえば、特定のシナリオでは、クリーンなフォントを含む最小限のテーマが必要です。Liberty テーマなら、その外観を実現できます。

リファレンステーマ

このパッケージに含まれるテーマはレスポンシブで、これらのテーマ内のスタイルはモバイルおよびデスクトップ表示用として定義されています。様々なデバイス上のほとんどの最新のブラウザーは、これらのテーマのいずれかが適用されたフォームを問題なくレンダリングできます。

パッケージのインストールについて詳しくは、パッケージの使用方法を参照してください。

ベリル

Beryl テーマは、We.Gov アダプティブフォームで使用され、背景画像、透明度および大きくてフラットなアイコンの使用を強調します。下のスクリーンショットでは、Berylテーマの外観と、フォームのスタイル設定を強化する方法を確認できます。
Beryl
themeClick to enlarge

Exec

Exec テーマは、背景を淡色で塗りつぶさず、フォームコンポーネントを強調します。コンポーネントを選択してクリックすると、フォントの色が変わります。デフォルトのキャンバステーマと比較すると、選択したタブのテキストのフォント色は濃い青に変わります。ナビゲーションボタンと「送信」ボタンが Beryl テーマとは異なることに注目してください。Exec テーマ

クリックして拡大

Exec Light

Exec Light テーマは、ホワイトスペースを使用してシームレスなエクスペリエンスを作成します。「次へ」ボタンと「送信」ボタンは、淡色で塗りつぶされ、3D の影が付きます。左側で選択したタブには、ダブルチェックマークではなく矢印が付きます。Exec Light テーマ

クリックして拡大

自由

Liberty テーマは、最小限のアプローチを使用して、重要な部分を強調します。たとえば、訪問済みのタブのフォントの色は緑に変わります。テキストボックスの下のアウトラインだけが表示されます。これは、線が引かれている紙ベースのフォームの外観をエミュレートしています。アクティブなテキストボックスの下のアウトラインは黒で、その他のテキストボックスの下のアウトラインは薄い灰色です。Liberty テーマ

クリックして拡大

Tranquil

Tranquil テーマは、Tranquil カラースキームの明るいシェーディングと暗いシェーディングを提供して、フォームの様々なコンポーネントを強調します。たとえば、ラジオボタン、パネルおよびタブは、様々なシェーディングの緑色になります。Tranquil テーマ

クリックして拡大

Ultramarine

Ultramarine テーマは、濃い青色のシェーディングを使用して、タブ、パネル、テキストボックス、ボタンなどのコンポーネントを強調します。Ultramarine テーマ

Urbane

Urbaneテーマは、フォームのミニマリストで機能的な外観を強調します。 Urbaneテーマをフォームに適用すると、コンポーネントがフラットになっていることがわかります。 パネルには細いアウトラインが付けられ、モダンな外観を作成します。Urbane テーマ

クリックして拡大

米国Webデザイン規格

U.S. Web Design Standardsテーマは、名前が示すように、Draft U.S. Web Design Standardsサイトに記載されている書体とスタイルを使用します。 この Web 標準は、連邦政府の Web サイト間での Web エクスペリエンスを統一するために、連邦政府機関で使用されています。U.S. Web Design Standards テーマ

クリックして拡大

このページ