合成と混合

合成と混合 (Compositing and Blending) は CSS モジュールの一つで、様々な要素のシェイプを単一の画像に合成する方法を定義します。

リファレンス

プロパティ

• background-blend-mode
• isolation
• mix-blend-mode

データ型

• <blend-mode>

仕様書

仕様書	状態	備考
Compositing and Blending Level 1	勧告候補	初回定義

ブラウザーの対応

background-blend-mode プロパティ

このページの互換性一覧表は構造化データから生成されています。データに協力していただけるのであれば、 https://github.com/mdn/browser-compat-data をチェックアウトしてプルリクエストを送信してください。

Update compatibility data on GitHub

	デスクトップ						モバイル
	Chrome	Edge	Firefox	Internet Explorer	Opera	Safari	Android webview	Android 版 Chrome	Android 版 Firefox	Android 版 Opera	iOSのSafari	Samsung Internet
background-blend-mode	Chrome 完全対応 35	Edge 未対応 なし 補足 未対応 なし 補足 補足 EdgeHTML 18 has an Enable CSS background-blend-mode property flag, however the feature is an early prototype with no discernable end-user effect.	Firefox 完全対応 30	IE 未対応 なし	Opera 完全対応 22	Safari 完全対応 8	WebView Android 完全対応 あり	Chrome Android 完全対応 35	Firefox Android 完全対応 30	Opera Android 完全対応 22	Safari iOS 完全対応 8	Samsung Internet Android ?

凡例

完全対応  

完全対応

未対応  

未対応

実装状況不明  

実装状況不明

実装ノートを参照してください。

実装ノートを参照してください。

isolation プロパティ

このページの互換性一覧表は構造化データから生成されています。データに協力していただけるのであれば、 https://github.com/mdn/browser-compat-data をチェックアウトしてプルリクエストを送信してください。

Update compatibility data on GitHub

	デスクトップ						モバイル
	Chrome	Edge	Firefox	Internet Explorer	Opera	Safari	Android webview	Android 版 Chrome	Android 版 Firefox	Android 版 Opera	iOSのSafari	Samsung Internet
isolation	Chrome 完全対応 41	Edge 未対応 なし	Firefox 完全対応 36	IE 未対応 なし	Opera 完全対応 30	Safari 完全対応 8	WebView Android 完全対応 41	Chrome Android 完全対応 41	Firefox Android 完全対応 36	Opera Android 完全対応 30	Safari iOS 完全対応 8	Samsung Internet Android 完全対応 4.0

凡例

完全対応  

完全対応

未対応  

未対応

mix-blend-mode プロパティ

このページの互換性一覧表は構造化データから生成されています。データに協力していただけるのであれば、 https://github.com/mdn/browser-compat-data をチェックアウトしてプルリクエストを送信してください。

Update compatibility data on GitHub

	デスクトップ						モバイル
	Chrome	Edge	Firefox	Internet Explorer	Opera	Safari	Android webview	Android 版 Chrome	Android 版 Firefox	Android 版 Opera	iOSのSafari	Samsung Internet
mix-blend-mode	Chrome 完全対応 41	Edge 未対応 なし	Firefox 完全対応 32	IE 未対応 なし	Opera 完全対応 あり	Safari 完全対応 8	WebView Android 完全対応 41	Chrome Android 未対応 なし	Firefox Android 完全対応 32	Opera Android ?	Safari iOS 完全対応 8	Samsung Internet Android ?
On SVG elements	Chrome 完全対応 41	Edge 未対応 なし	Firefox 完全対応 32	IE 未対応 なし	Opera 未対応 なし	Safari 未対応 なし	WebView Android 未対応 なし	Chrome Android 未対応 なし	Firefox Android 完全対応 32	Opera Android 未対応 なし	Safari iOS 未対応 なし	Samsung Internet Android ?

凡例

完全対応  

完全対応

未対応  

未対応

実装状況不明  

実装状況不明