公開日: 2026 年 5 月 19 日
これは、Modern Web Guidance で現在利用可能なすべてのユースケースの生成リストです。
accessibility
accessible-error-announcement
プログラムによるユーザー補助機能の状態（aria-invalid など）を視覚的な :user-invalid 状態と同期させ、スクリーン リーダーのユーザーがエラー フィードバックを受け取るのは操作後のみになるようにして、視覚的なエクスペリエンスを反映させます。
使用する機能:
built-in-ai
language-detection
使用する機能:
language-model
Prompt API を使用して、ブラウザでオンデバイスの自然言語推論を実行します。ストリーミング出力、構造化された JSON レスポンス、マルチターンのセッション管理が可能です。
使用する機能:
summarizer
オンデバイスの Summarizer API を使用してテキスト コンテンツを要約します。
使用する機能:
translator
使用する機能:
css
highlight-text-ranges
検索結果、スペルミス、共同編集カーソルなど、ページ上の任意のテキスト範囲をハイライト表示します。
使用する機能:
forms
animated-select-picker
ドロップダウンがアニメーション化されたカスタム選択コンポーネントを作成します。たとえば、メニューがフェードインまたはスライドインして表示されたり、オプションを選択するとアニメーションが表示されたりします。
使用する機能:
autofill-address-form
正しい予測入力属性と自動入力サポートを使用して住所フォームを作成します。
使用する機能:
autofill-highlight-inputs
CSS を使用して、ブラウザによって自動入力され、ユーザーによって編集されていないフォーム フィールドをハイライト表示します。
使用する機能:
autofill-payment-form
正しい予測入力値と自動入力のサポートを使用してカード情報を収集する支払いフォームを構築します。
使用する機能:
autofill-sign-in-form
正しい自動補完値と自動入力のサポートを使用してログイン フォームを作成します。
使用する機能:
autofill-sign-up-form
正しい自動入力値と自動入力のサポートを使用して登録フォームを作成します。
使用する機能:
brand-consistent-forms
チェックボックス、ラジオボタン、範囲スライダー、進行状況バーをカスタム コンポーネントに置き換えることなく、サイトのカラーパレットに合わせます。
使用する機能:
branded-select-styling
ボタン、ピッカー、矢印アイコン、チェックマークがブランドやデザイン システムのタイポグラフィ、色、スペーシング、枠線処理とシームレスに一致するカスタム選択要素を作成します。
使用する機能:
custom-select-picker-layouts
オプションが従来の積み重ねられたリストではなく、ユニークで興味深い方法で配置されたカスタム選択ピッカーを作成します。
使用する機能:
form-fields-automatically-fit-contents
ユーザーの入力に合わせてフォーム フィールドを拡大縮小できるようにします（ユーザーが入力したり、別のオプションを選択したりする場合など）。最大サイズと最小サイズの制限を適用して、ページのデザインに準拠した動的でレスポンシブなフォーム フィールドを作成します。
使用する機能:
required-field-feedback
必須のフォーム フィールドがスキップされたり、空欄のままにされたりした場合のエラー メッセージは、ユーザー インタラクションの後でのみ表示するようにします。これにより、先制的なエラーを回避し、フィードバックがユーザーのフローに沿ってタイムリーかつコンテキストに関連したものになるようにします。
使用する機能:
rich-media-picker
オプションにプレーン テキストだけでなく複雑な HTML 形式（画像、アイコン、その他のリッチ形式など）を含めることができるカスタム選択コンポーネントを作成します。
使用する機能:
select-menu-interaction
ユーザーがコントロールを操作した後にのみ、選択メニューでデフォルト以外のオプションが選択されていることを検証します。
使用する機能:
validate-input-after-interaction
フォーム フィールドの検証フィードバック（パスワードの複雑さやメール形式の要件など）は、ユーザーが最初の操作を完了した後にのみ表示し、ページ読み込み時やユーザーが入力中にエラーが早すぎることを避けます。
使用する機能:
passkeys
passkey-authentication
プライマリ ログインでパスキーを使用してリピーターを認証します。
使用する機能:
passkey-conditional-create
パスワード ログインが成功した後、既存のユーザーのパスキーをサイレント登録します。
使用する機能:
passkey-management
ユーザーがアカウントに登録されているパスキーを表示および管理できるようにします。
使用する機能:
passkey-reauthentication
機密情報に関する操作を行う前に、ログインしているユーザーの既存のパスキーを使用してユーザーの身元を確認します。
使用する機能:
passkey-registration
既存のユーザー アカウントにパスキーを登録します。
使用する機能:
performance
batch-analytics-events
複数の分析イベントを 1 つのビーコンにまとめてバッチ処理することで、ネットワーク競合を最小限に抑え、サーバー負荷を軽減しながら、リアルタイムの更新を実現します。
使用する機能:
break-up-long-tasks
重い同期処理（複雑な計算や長いループなど）や DOM の更新を分割して、ブラウザがユーザー入力を処理して画面を再描画できるようにします。
使用する機能:
calculate-total-foreground-time
タブがバックグラウンドにあった期間を除き、ユーザーが実際にページを閲覧した合計時間を計算します。
使用する機能:
conditional-async-dependencies
ページのスクリプト依存関係全体にわたる複雑なオーケストレーションを必要とせずに、非同期依存関係（欠落しているウェブ機能のポリフィルをインポートするなど）を条件付きで読み込んだり初期化したりします。
使用する機能:
defer-rendering-heavy-content
ユーザーにすぐに表示されないコンテンツのレンダリングを遅延させることで、コンテンツの多いウェブページ（長いフィード、多数の記事、複雑なダッシュボードを含むページなど）のレンダリング時間を短縮します。
使用する機能:
defer-work-until-scroll-ends
スムーズなスクロール パフォーマンスを維持するため、DOM の更新、データの取得、分析トラッキング、レイアウトの再計算などの負荷の高いオペレーションは、スクロールが完了するまで延期します。
使用する機能:
deprioritize-background-fetches
Fetch API を使用して行われたバックグラウンド データ取得の優先度を下げ、ユーザーが開始したリクエストとのネットワーク競合を防ぎます。
使用する機能:
detect-initial-visibility-state
ユーザーがページをフォアグラウンドに切り替えた後でスクリプトが非同期で読み込まれる場合でも、ページが最初にバックグラウンドで読み込まれたかどうかを確実に判断します。
使用する機能:
efficient-background-processing
コンポーネントが画面外にあるときはバックグラウンドの JavaScript 実行（<canvas> アニメーション、WebGL レンダリング、高頻度の WebSocket データ ポーリングなど）を一時停止し、スクロールして画面内に戻ってきたらジャストインタイムで再開することで、システム リソースとバッテリー駆動時間を節約します。
使用する機能:
faster-spa-view-transitions
シングルページ アプリケーション（SPA）で、以前にアクセスしたビューへの移行を高速化します。ナビゲーションのたびにビューを破棄して再構築するのではなく、構造的な DOM 状態を保持します。
使用する機能:
full-session-analytics
ユーザーがページにアクセスしている間、アナリティクス、エラー、テレメトリー データを確実にトラッキングし、ユーザーがページを離れるまでデータの送信を遅延させます。
使用する機能:
identify-heavy-scripts
アニメーション フレームの長さに最も影響を与えたスクリプトを特定する
使用する機能:
identify-inp-causes
INP 指標に影響している実行速度の遅い JavaScript を特定する
使用する機能:
improve-next-page-load-performance
ユーザーが次にアクセスする可能性の高いページをプリフェッチまたは事前レンダリングすることで、ページの読み込みパフォーマンスを改善します。
使用する機能:
interactions-in-complex-layouts
データ量の多いダッシュボードやスプレッドシート形式のグリッドなど、複雑なレイアウトでレイアウトの再計算を回避することで、インタラクションをより迅速かつレスポンシブにします（Interaction to Next Paint（INP）スコアを減らします）。
使用する機能:
optimize-image-priority
Largest Contentful Paint（LCP）の候補画像の読み込み優先度を最適化し、重要でない画像の優先度を下げることで、重要なリソースの読み込み遅延を短縮します。
使用する機能:
optimize-preload-priority
プリロードされたコンテンツの相対的な優先度を最適化して、重要なリソースの読み込み遅延を短縮します。
使用する機能:
optimize-script-priority
重要な非同期スクリプトの優先度を上げ、重要でないスクリプトや遅延読み込みスクリプトの優先度を下げることで、スクリプトの読み込み優先度を最適化し、シーケンスを改善して遅延を短縮します。
使用する機能:
resolution-optimized-pseudo-elements
CSS 疑似要素（::before や ::after など）で解像度最適化された画像を使用して、DOM ノードの数を減らします。
使用する機能:
schedule-tasks-by-priority
優先度の異なるタスクをスケジュールして、重要な作業が最初に実行され、バックグラウンド作業が延期されるようにします。
使用する機能:
sequence-distributed-events
ナノ秒単位のタイムスタンプを記録して、分散マイクロサービスまたは高スループットのトレース環境でオペレーションをログに記録し、順序付けします。
使用する機能:
user-experience
adapt-scrollbar-to-contrast-preferences
高コントラストのインターフェースを好むユーザー向けにスクロールバーの視認性を向上
使用する機能:
anchor-positioning-tab-underline
2 つのターゲット要素の位置間で要素をシームレスに移行します。たとえば、選択したタブの下線を、以前に選択したタブと現在選択したタブの間で移動します。
使用する機能:
animate-element-entry-exit
DOM から要素が追加または削除されたとき、または要素の表示値が切り替えられたときに、要素をスムーズに非表示または表示します。
使用する機能:
animate-to-from-top-layer
ダイアログ、ポップオーバー、ツールチップなどの要素がトップレイヤに出入りする際にアニメーション化します。
使用する機能:
animate-to-intrinsic-sizes
インタラクティブ コンポーネント（アコーディオン、メニュー、展開するカードなど）を自然なサイズにスムーズにアニメーション表示します。
使用する機能:
apply-webgl-shaders
WebGL シェーダーを使用して、HTML コンテンツにカスタム ビジュアル エフェクトを適用します。
使用する機能:
calculate-event-differentials
日付と時刻の間の期間と残り時間を計算します。
使用する機能:
calculate-with-intrinsic-sizes
要素の固有サイズに基づいて要素のサイズを計算し、指定されたデザイン制約内に収まるようにします。
使用する機能:
capture-location-agnostic-data
誕生日、定期的なアラーム、祝日など、ユーザーの現在地に基づいて変更されない時系列データを記録します。
使用する機能:
carousel-slide-effects
画像などの視覚要素を含むスライドのカルーセルを作成します。各スライドは、スクローラーに入るとき、中央に配置されるとき、スクローラーから出るときにアニメーション化されます。たとえば、スライドがフェードイン / フェードアウトしたり、回転したり、拡大 / 縮小したりします。
使用する機能:
carousel-snap-highlights
スクロール スナップ カルーセル、ギャラリー、全画面スワイプ エクスペリエンスで、現在スナップされているインタラクティブでないアイテムを視覚的にハイライト表示します。たとえば、スナップ時にカードを展開したり、隠しコンテンツを表示したりします。
使用する機能:
child-state-based-styling
子要素の 1 つの状態に基づいてスタイルを変更するコンポーネントを構築します。たとえば、テーマの切り替えがオンになっているかどうかに基づいて、ライトモードまたはダークモードでレンダリングするコンポーネントなどです。
使用する機能:
complex-shapes
要素とそのコンテンツを、記号、ブラシストローク、有機的なテクスチャなどの自由形式のシェイプにクリップして、より表現力豊かなデザインを作成できます。
使用する機能:
component-specific-light-dark-theme
ページのカラースキームに関係なく、特定の要素（コードブロック、メディア プレーヤーなど）をライトモードまたはダークモードに強制的に設定します。
使用する機能:
consistent-cross-document-transitions
クロスドキュメント ビューの切り替えを開始する前に、重要なページの状態が読み込まれて安定していることを確認します。つまり、重要な CSS スタイルが読み込まれて適用され、重要な JavaScript が読み込まれて実行され、ページの最初のビューでユーザーに表示される HTML が、トランジションの実行前に解析されます。
使用する機能:
content-based-styling
特定の子要素が含まれているかどうかに基づいてレイアウトを変更するコンポーネントを作成します。たとえば、コンポーネントに画像が含まれている場合は複数列レイアウトを使用し、それ以外の場合はデフォルトの単一列レイアウトを使用します。
使用する機能:
coordinate-global-events
将来の会議やイベントを、地理的な IANA タイムゾーンに明示的にバインドしてスケジュールします。これにより、夏時間（DST）の移行や、時計の変更時に「スキップ」または「繰り返し」が発生した時間に関係なく、イベントの時刻が正確に保たれます。
使用する機能:
cross-document-transitions
クロスフェード、カスタムの表示効果、あるページから次のページへのコンテンツのモーフィングなど、全画面ナビゲーション間のスムーズでシームレスなトランジションを作成します。
使用する機能:
customize-scrollbar-color-and-thickness
スクロールバーの色や太さをカスタマイズする
使用する機能:
dark-mode
ユーザーのライト/ダークテーマの設定を尊重し、ブラウザの UI（スクロールバー、フォーム コントロールなど）を適応させる方法でダークモードのサポートを実装する
使用する機能:
declarative-button-actions
宣言型ボタン コマンド、インボーカー コマンド、ボタン コマンド、カスタム コマンド、宣言型切り替えアクションを使用して、ボタンを任意の要素に宣言的に接続し、カスタムのアプリケーション固有のアクションをトリガーします。
使用する機能:
declarative-dialog-popover-control
JavaScript を記述せずに、ボタンからダイアログまたはポップオーバーの表示 / 非表示を切り替えます。
使用する機能:
deliver-optimized-decorative-images
次世代の画像形式（AVIF や WebP など）と複数のピクセル密度（1 倍や 2 倍など）を同時に提供することで、最適化された装飾画像（背景、UI アイコン、複雑なマスクなど）を配信します。これにより、ブラウザはユーザーのデバイスの性能に合わせてファイルサイズと画質の最適な組み合わせを動的にネゴシエートできます。
使用する機能:
design-token-reactivity
密度モード（コンパクト、標準、広々）やテーマなどの高階デザイン トークンを定義し、子孫コンポーネントが変更に直接、コンポーネントに適した方法で反応するようにします。
使用する機能:
directional-navigation-transitions
ユーザーのナビゲーション フローの方向を反映するように、ビジュアル状態の変化をアニメーション化します。たとえば、進むときは右から新しいコンテンツをスライドインさせ、前の画面に戻るときは左からスライドインさせます。
使用する機能:
dynamic-sibling-animations
兄弟要素間でアニメーションまたはトランジションのタイミングをずらして、兄弟リスト内の位置に基づいて計算された遅延の後に各要素が開始されるようにします。
使用する機能:
dynamic-sibling-styling
グループ内の要素の数に合わせて自動的に調整される動的なビジュアル スペクトルやレイアウト配置を作成します。
使用する機能:
export-html-media-from-canvas
キャンバス内で動的 HTML コンテンツを画像または動画フレームとしてキャプチャしてエクスポートします。
使用する機能:
expose-canvas-content-to-browser-features
キャンバスでレンダリングされたコンテンツを、ユーザー補助機能、翻訳、リーディング モードなどのブラウザ機能に公開します。
使用する機能:
flicker-free-client-side-ab-testing
クライアントサイドの JavaScript を使用して A/B テスト、多変量テスト、その他のテストを実施し、HTML、CSS、JavaScript を変更または挿入して、元のコンテンツが最初に表示されてから、テストのコンテンツを表示するためにちらついたり点滅したりしないようにする。
使用する機能:
fluid-scaling
固定ブレークポイントを使用するのではなく、親コンテナのサイズに基づいてフォントサイズ、スペーシング、メディアサイズなどの項目をスムーズにスケーリングする
使用する機能:
format-human-readable-durations
経過時間や期間を読みやすいローカライズされた形式でユーザーに表示します。コンテキストに応じて、詳細な単位の内訳（「1 時間 30 分」など）または単位の合計数（「90 分」など）のいずれかを表示できます。
使用する機能:
group-element-transitions
同じトランジション ロジックを使用して、類似した要素のグループを同時にトランジションします。たとえば、ショッピング カートから商品を削除し、他のすべての商品を新しい位置にアニメーション表示します。
使用する機能:
improve-text-layout-and-legibility
ブラウザでテキストを折り返す際に、均等にバランスの取れた改行を適用できるようにすることで、数行以内の見出しなどの短いスタンドアロンのテキスト コンテンツのレイアウトと読みやすさを改善します。
使用する機能:
individual-transform-properties
単一の要素で、個々の CSS 変換プロパティ（translate、rotate、scale など）を他の変換プロパティとは独立してアニメーション化またはオーバーライドします。
使用する機能:
interactive-content-in-3d-scenes
インタラクティブな HTML 要素を 3D シーンに統合します。
使用する機能:
interactive-content-reveal
ユーザーのポインタを追跡して画像や UI セクション内の詳細を表示するスポットライトなど、インタラクティブな表示効果を作成します。
使用する機能:
interest-triggered-action-previews
ユーザーが関心を示したとき（カーソルを合わせる、フォーカスする、長押しするなど）、クリックする前にボタンの効果のライブ プレビューを表示します。
使用する機能:
interest-triggered-tooltips
ユーザーがインタラクティブな要素にカーソルを合わせたり、フォーカスを置いたり、要素を長押ししたりすると、クリックを必要とせずにツールチップまたは補足情報を表示します。
使用する機能:
light-dismiss-a-dialog
ライト ディスミス（ダイアログの外側をクリックまたはタップ）を使用して閉じることができるモーダル ダイアログを作成します。
使用する機能:
manage-recurring-intervals
定期購入の請求または給与計算の周期を計算し、月末の移行（1 月 31 日に 1 か月を追加するなど）などのエッジケースを自動的に調整して、期間を正確に計算します。
使用する機能:
model-partial-time-concepts
計算エラーを引き起こす任意のプレースホルダ値を使用せずに、標準コンポーネント（特定の年、日、日付など）が本質的に欠落している日付と時刻のコンセプトをモデル化します。
使用する機能:
move-dom-element-without-losing-state
インタラクティブ状態（:focus/:active）、<iframe> 読み込み状態、アニメーション/トランジション状態などの重要な要素の状態を失うことなく、DOM 要素を移動または再親化する
使用する機能:
navigation-drawer
メニューボタンからトリガーされると、既存のページ コンテンツの上に重ねてサイドからスライドインし、閉じられると（スワイプで閉じる、外側をタップする、Esc キーを押す）、スライドアウトするナビゲーション ドロワー コンポーネントを作成します。
使用する機能:
inertintersection-observerpopoverregistered-custom-propertiesscroll-driven-animationsscroll-initial-targetscroll-snap
overflow-clipping-control
要素の表示されるクリッピング境界を調整して、コンテンツの端、パディングの端、枠線の端、またはこれらのいずれかからの指定されたオフセットに合わせ、コンテンツのクリッピング方法をより細かく制御できるようにします。
使用する機能:
parallax-scroll-effects
スクロールベースのエフェクト（パララックスなど）を作成します。このエフェクトでは、ユーザーがスクロールすると、フォアグラウンドレイヤと背景レイヤが異なる速度で移動し、奥行き感が生まれます。
使用する機能:
persistent-app-tours
ユーザー インタラクション中に開いたままになるテザリングされたネイティブ オーバーレイを使用して、永続的なオンボーディング チュートリアルを作成します。
使用する機能:
persistent-toast-notifications
永続的でスタック可能なメッセージングと状態通信のための、邪魔にならないトーストとオーバーレイの通知を作成します。
使用する機能:
persistent-top-layer-ui
基盤となる DOM ノードが DOM 内で移動または再ペアレント化されたときに、モーダル ダイアログ、全画面要素、ネイティブ ポップオーバーを視覚的に開いた状態にし、機能的にアクティブな状態を維持します。
使用する機能:
physics-based-easing
従来のイージング曲線よりも自然で魅力的な、バウンドやスプリングなどの物理ベースのカスタム アニメーションやトランジション効果を作成できます。
使用する機能:
platform-controls-dismiss-dialog
パソコン プラットフォームの Esc キーを押す、モバイル プラットフォームの「戻る」ジェスチャーや「閉じる」ジェスチャーなど、プラットフォーム固有の標準的なユーザー アクションで閉じることができるモーダル ダイアログを作成します。
使用する機能:
position-aware-tooltips
要素がフォールバック位置に切り替わったときに正しい方向を自動的に指す方向矢印（またはその他の視覚的なスタイル設定）を使用して、ツールチップとポップオーバーを構築します。
使用する機能:
precise-text-alignment
任意のフォントのテキストで正確な垂直方向の配置を実現します。たとえば、テキストの上下の視覚的なパディングを完全に同じにしたり、テキストを隣接するアイコンや画像と完全に揃えたりします。
使用する機能:
prevent-text-wrapping
ブラウザでテキストに改行が挿入されず、テキストがコンテナからオーバーフローすることを確認します。
使用する機能:
pull-to-reveal
ユーザーが画面を下に引っ張って検索バーなどのコンテンツを表示できる、プルして表示する機能を構築します。
使用する機能:
reduce-style-repetition
複雑なスタイル設定ロジックや動的なスタイル設定ロジックを再利用可能な関数（一連の入力パラメータに基づいてグラデーションを計算する関数など）にカプセル化して、過剰なスタイルの繰り返しを減らします。
使用する機能:
resilient-context-menus-and-nested-dropdowns
特定の UI 要素に固定する必要がある、アクセシビリティ対応のレスポンシブなメニュー、ツールチップ、ドロップダウン、コンテキスト オーバーレイを構築します。ビューポートの端に達したときにオーバーレイが自動的に再配置（軸の反転など）され、切り取られることがないようにします。
使用する機能:
same-document-transitions
サイズ、位置、その他のスタイリング プロパティをスムーズに変化させることで、シングルページ アプリケーション（SPA）のさまざまなページの状態やナビゲーションで、永続的な要素を視覚的に接続します（例: 商品のサムネイルをフルブリードのヒーロー画像に拡大する）。
使用する機能:
scroll-entry-exit-effects
ユーザーがスクロールしているときに、要素がスクロールポート（またはビューポート）に出入りする際に、フェードイン、スケールアップ、その他の複雑な表示効果を作成します。
使用する機能:
scroll-position-aware-elements
ユーザーがスクロールしたかどうかに応じて表示と非表示を切り替えるフローティング ボタンやウィジェット（上に戻る、下にスクロール、チャット ランチャーなど）を構築します。
使用する機能:
scroll-progress-indicator
スクロール進行状況バー、段階的な進行状況トラッカー、またはユーザーがページやセクションをどの程度スクロールしたかを伝える視覚的なアフォーダンスを作成します。
使用する機能:
scroll-snap-realtime-feedback
ユーザーがスナップ位置に揃えられたコンテンツをスクロールしている間、スクロール ジェスチャーが完了する前に、リンクされた UI 要素でリアルタイムの視覚的フィードバックを提供します。
使用する機能:
scroll-snap-state-sync
スクロール可能なコンテナ内でアクティブにスナップされたアイテムと、ナビゲーション インジケーター、リンクされたコンテンツ パネル、分析トラッキングを同期します。
使用する機能:
scroll-target-on-load
特定の要素が初期レンダリングでビューにスクロールされて表示される要素のスクロール可能なリスト（画像のカルーセルやチャットの会話スレッドなど）を作成します。
使用する機能:
scrollability-affordance-hints
スクロール シャドウ オーバーレイ、グラデーション フェード、方向矢印インジケーターを作成します。これらは、その方向にスクロールするコンテンツが実際にある場合にのみ表示されます。
使用する機能:
scrollytelling
まったく異なる要素のスクロールポートの位置によって、ターゲット要素の視覚プロパティ（背景のフェード、背景色の変更、スクロール テリング エクスペリエンスの作成など）を完全にアニメーション化します。
使用する機能:
search-hidden-content
アコーディオン、タブ、[続きを読む] セクションなどのパターンを使用してコンテンツを非表示にし、非表示のテキストがネイティブの [ページ内検索] で表示されるようにします。これにより、検索エンジンのインデックス登録が可能になり、URL フラグメントのディープリンクがサポートされ、ARIA のアクセシビリティが維持されます。
使用する機能:
shaped-cutouts
複数のシェイプを組み合わせて、複雑な切り抜きや「ノックアウト」効果を要素に作成できます（要素にノッチを追加するなど）。
使用する機能:
shrinking-header-on-scroll
スクロール時に固定ヘッダーまたは全ページ カバーをスムーズにアニメーション化して、事前に定義されたスクロール距離で動的に縮小したり、シャドウを追加したり、レイアウトを変換したりします。
使用する機能:
size-aware-styling
ビューポートの幅や高さではなく、コンポーネント自身の幅や高さに条件付きで依存できるスタイルを持つコンポーネントを構築します。たとえば、サイズに応じてレイアウトを変更できるカード コンポーネントや、幅に基づいてヘルパー テキストを条件付きで表示できる行動を促すフレーズのボタンなどです。
使用する機能:
soft-edge-content-fade
コンテンツの端に透明度グラデーションを適用して、スクロール可能な領域をさらに示したり、ペイウォールで保護されたテキストを隠したりします。
使用する機能:
stabilize-reactive-state
共有の可変状態による予期しない副作用を伴うことなく、データドリブン ビューでタスクの期限やスケジュールを管理できます。
使用する機能:
stack-drill-down
全画面の階層ナビゲーションを構築して、ユーザーがネストされたビューをドリルダウンし、スワイプまたはナビゲーションで戻れるようにします。ブラウザの履歴は同期されます。
使用する機能:
style-parent-with-has
フィールドが無効な場合に、フォーム フィールドの親要素（ラベルや fieldset など）のスタイルを設定します。
使用する機能:
support-global-calendar-systems
海外のユーザー向けに、グレゴリオ暦以外のカレンダー システム（イスラム暦、ヘブライ暦、中国暦など）の日付を正確に表示して計算します。
使用する機能:
swipe-to-remove
ユーザーがリスト内のアイテムを横スワイプ ジェスチャーで操作（削除、アーカイブ、既読にするなど）できるようにします。これにより、ユーザーは別のコントロールをタップすることなく、エントリをすばやく処理できます。
使用する機能:
scroll-snapscroll-initial-targetoverscroll-behaviorscrollbar-widthintersection-observermutationobserverresize-observerweb-animations
visually-stable-font-fallbacks
優先フォントとフォールバックの 1 つが入れ替わった場合（またはその逆の場合）でも、テキストが読みやすく、視覚的に一貫性が保たれるように、フォント スタイルを定義します。
使用する機能:
visually-stable-mixed-fonts
複数のフォントを使用して 1 つのテキスト ブロックをレンダリングする場合でも、テキストが読みやすく、視覚的に一貫性を保つようにフォント スタイルを定義します。
使用する機能:
visually-texture-content
要素にリアルな風化やテクスチャ パターンを適用して、有機物、経年変化、物理的な素材の外観を与えます。
使用する機能:
webmcp
agentic-forms
標準の HTML フォームに WebMCP 属性でアノテーションを付けることで、クライアントサイドの機能を AI エージェントのツールとして公開します。
使用する機能:
agentic-javascript-tools
WebMCP 命令型 API を使用して、クライアントサイドの JavaScript 関数を AI エージェントのツールとしてプログラムで登録します。
使用する機能: