Chromeに「CSS Filter Effects」が実装

ニュース
トップ

Chromeに「CSS Filter Effects」が実装

後藤大地  [2012/06/07]

Google Chrome runs web pages and applications with lightning speed.

6月4日(米国時間)のChromium公式ブログにおいて、「CSS Filter Effects」が紹介されている。「CSS Filter Effects」は、W3Cが3月末に公開したドラフト仕様である「Filter Effects 1.0」を、ChromiumのWebKitに実装したもの。最新のChromium 19で利用できる。

Chromiumに実装された「CSS Filter Effects」は現在、グレースケール[grayscale()]、セピア[sepia()]、彩度[saturate()]、不透明度[opacity()]、輝度[brightness()]、コントラスト[contrast()]、ぼかし[blur()]、反転[hue-rotate()]、ドロップシャドウ[drop-shadow()]、色相回転[hue-rotate()]などの画像処理フィルタを提供している(括弧内はフィルタ関数)。

ブログ内では、Chromiumのロゴ画像に対して「img { -webkit-filter: sepia(100%) contrast(200%) blur(5px) }」というスタイルシートの設定例を披露しており、簡単に画像を加工できると紹介している。

左がオリジナルの画像で右が「CSS Filter Effects」を使用した画像 - 公式ブログより抜粋

「CSS Filter Effects」を紹介しているStephen White氏によると、「CSS Filter Effects」の詳細な情報についてはHTML5Rocksのサイトが参考になるという。また、「CSS Filter Effects」がどのようなものであるのかはデモページで体験できるとしている。

関連したタグ


マイナビニュースのセミナー情報

オススメ記事

マイナビニュースの集合特集

関連記事

関連サイト

新着記事

転職ノウハウ

あなたの仕事適性診断
あなたの仕事適性診断

4つの診断で、自分の適性を見つめなおそう!

Heroes File ~挑戦者たち~
Heroes File ~挑戦者たち~

働くこと・挑戦し続けることへの思いを綴ったインタビュー

はじめての転職診断
はじめての転職診断

あなたにピッタリのアドバイスを読むことができます。

転職Q&A
転職Q&A

転職に必要な情報が収集できます

ドS美人面接官 vs モテたいエンジニア
ドS美人面接官 vs モテたいエンジニア

入室しようとしたら、マサカリ投げられちゃいました!?

特別企画

一覧

    人気記事

    一覧

    イチオシ記事

    新着記事

    【短期連載】VAIOのいま、そしてこれから(13) - 気になるオリジナル製品の行方
    [07:00 9/24] パソコン
    【連載】育児砂漠…! 第10回 母の愛情料理の正体
    [07:00 9/24] ライフ
    江口洋介、福島原発20キロ圏内へ - 地元の人を取材「信念を感じました」
    [07:00 9/24] エンタメ
    【連載】1コマ漫画 猫にありがちなこと 第395回 買ってもらった猫じゃらしが愛しすぎて頬ずり
    [07:00 9/24] ライフ
    【連載】東京論――オリンピックで変貌する都市の風景 第1回 2020年の東京は旧市街と新市街に分裂する!? 建築学者・門脇耕三氏に聞いた
    [07:00 9/24] 住まい・インテリア

    特別企画

    一覧

      求人情報