適用するだけでインスタ映え？クールで便利な画像フィルター系CSSライブラリ5選
現在はFacebook傘下にある、大人気の無料の写真共有サービスInstagram(以下、インスタグラム)。日本では*「インスタ」とも呼ばれ、フォトジェニックな写真をアップロードして人気を博しているユーザーは「インスタグラマー」*として注目を集めています。 クールでフォトジェニックな写真は*「インスタ映え」とも形容され、一方で2018年1月頃から、真逆の価値観として「インスタ萎え」*という言葉もプチ流行しています。インスタグラムには標準でも多数のフィルターが用意されており、こうしたフィルターで画像処理を行いながら撮られたかっこいい写真は、ホームページやブログで引用されることもあります。 しかし、わざわざインスタグラム経由でフィルターを使わなくとも、少しの手間で簡単に「インスタ映え」する方法があればどうでしょう？しかもその手間が10分未満だったら？ そこで今回は、そうした短時間であっという間
Liquid CSS！まるで液体のようなデザインを実装するCSS技
Liquid CSS窓ガラスに張りつく水滴。コロコロ転がる水銀。 接近する液体同士が表面張力で引かれ合う様子。 これらは物理現象ですが、デザインにおいても液体表現は面白いですよね。 実は、 CSSだけでも 近い表現が可能です（※制限あり）。 まずは作り方、 簡単3ステップ で解説します。 下のサンプルをご覧ください。 See the Pen Demo: Liquid CSS by Yusuke Nakaya (@YusukeNakaya) on CodePen. blur 親要素に filter プロパティの blur() を指定します。 全体の描画がボケます。 contrast blur() と同時に contrast() も指定します。 ボケた描画のコントラストを上げます。 background ボケ感＋高コントラストの要素にさらに background で背景色を指定します。 すると
filter | CSS-Tricks
Get affordable and hassle-free WordPress hosting plans with Cloudways — start your free trial today. CSS Filters are a powerful tool that authors can use to achieve varying visual effects (sort of like Photoshop filters for the browser). The CSS filter property provides access to effects like blur or color shifting on an element’s rendering before the element is displayed. Filters are commonly use
CSS Filter Effectsの使い方
こんにちは、橋本です。 今日は最新版のChromeとWebkit(Nightly Build)で実装された「CSS Filter Effects」の使い方について書いていきたいと思います。 途中のサンプルは、最新のChromeもしくはWebkitを使って見てみてください。 また、サンプルではおなじみの麦わら帽をかぶった女性の画像を使っています。 この画像の女性はレナという方だそうで、この画像は元々はプレイボーイ誌に載っていたヌード写真の一部だそうです。 wikipedia: レナ (画像データ) 「CSS Filter Effects」とは、簡単に言うと「CSSで画像に対して画像処理フィルタを適用しちゃおう！」というものです。 Photoshopの画像処理フィルタのようなものだと思っていただけるといいかと思います。 具体的には、以下のようなフィルタが実装されています。 ・色相・明度・彩度
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
http://finch.ploogy.net/
