CSS画像フィルター生成CSS Image Filter Generator
グレースケール・ぼかし・明るさなどをスライダーで調整し、CSSのfilterを視覚的に生成。Visually generate the CSS filter property with grayscale, blur, brightness sliders and more.
お気に入りについて About favorites
この端末のブラウザにのみ保存され、サーバーには送信されません。 Saved on this device only—never sent to our servers.
使い方・ユースケース How to Use & Use Cases
サンプル画像（または自分の画像をアップロード）にグレースケール・ぼかし・明るさ・コントラスト・彩度・セピア・色相回転のスライダーを適用すると、プレビューがリアルタイムに更新され、対応するCSSの`filter`プロパティが生成されます。「画像をダウンロード」でフィルター適用後のPNGも保存できます。 Apply grayscale, blur, brightness, contrast, saturation, sepia, and hue-rotate sliders to the sample image (or upload your own) to see a live preview and the matching CSS filter property. Click "Download image" to save the filtered result as a PNG too.
写真をモノクロ・セピア調にしたいとき、ホバー時に画像を暗くするエフェクトのCSSがほしいとき、Instagram風のフィルターをCSSだけで再現したいときに使えます。 Useful for converting a photo to black-and-white or sepia tone, getting the CSS for a darken-on-hover image effect, or recreating an Instagram-style filter using only CSS.
よくある質問FAQ
生成されるCSSはどのプロパティですか？Which CSS property is generated?
要素の`filter`プロパティを生成します。複数の効果はスペース区切りで1つの`filter`値にまとめられます（例：`filter: grayscale(50%) blur(2px);`）。The filter property. Multiple effects are combined into one space-separated value (e.g. filter: grayscale(50%) blur(2px);).
画像をアップロードする必要がありますか？Do I need to upload an image?
必須ではありません。サンプル画像で効果を確認できます。自分の画像を使いたい場合はアップロードして同じ操作で調整できます。No. You can preview effects on the built-in sample image. Upload your own photo to adjust it the same way.
ダウンロードした画像にフィルターは焼き込まれますか？Is the filter baked into the downloaded image?
はい。「画像をダウンロード」で保存されるPNGは、プレビューのフィルターがピクセルに適用された状態で書き出されます。CSSの`filter`を使わずそのまま画像として利用できます。Yes. The downloaded PNG has the filter applied to the actual pixels, so you can use it as a standalone image without needing CSS filter.
画像はサーバーに送信されますか？Is the image sent to a server?
されません。プレビュー・書き出しともにブラウザ内（Canvas API）で処理されます。No. Both preview and export happen entirely in your browser using the Canvas API.
ページを閉じれば、端末内のデータは自動的に消去されます。契約書や顧客資料など、慎重に扱うデータも安心してご利用ください。When you close the page, data on your device is cleared automatically. Safe for sensitive files such as contracts and client documents.
