インプレス ビジネスメディア

コーディングが捗る！CSSを自動生成できる便利なジェネレータまとめ

2018年10月11日 11:29

※この記事は読者によって投稿されたユーザー投稿のため、編集部の見解や意向と異なる場合があります。
また、編集部はこの内容について正確性を保証できません。

コーディング中、「あれ、これってどうやって作るんだっけ？」と迷ったときに、お目当ての効果を簡単に作れるオンラインツールをよく利用しています。ツール上で色や数値などを設定すると、変更がプレビューされ、自動でHTMLやCSSのコードが生成されるので、複雑なCSSを書きたいときにとっても重宝します！また、すべて手で打つよりはるかに時短になります。

ということで、コーディング時の作業が短縮できる便利なジェネレータを集めてみました。

普段私がよく使っている便利ツールや、楽しくていくらでも作りたくなるツール、CSSの無限の可能性を感じさせるツールなどをご紹介します。

画像にCSSでフィルターをかける

CSSFilterGenerator.com　http://www.cssfiltergenerator.com/

画像にぼかしや色調補正のフィルターがかけられるCSSを生成できるのですが、これはすごい！

 

▼続きはこちら▼

https://citrusjapan.co.jp/column/cj-column/w006_201810.html

この記事のキーワード ：

この記事をシェアしてほしいパン！

前の記事

ページ表示速度改善のオススメ！～PageSpeed Insightsで簡単計測～

次の記事

自動車の「ぶつからない技術」の考えに学ぶ③

筆者の人気記事

参考にしたい！アーティストのサイトから学ぶWebデザインのトレンド

2017年10月24日 9:48

【必見】Webサイトのアクセスランキングを比較すると見えてきたこと

2017年8月17日 18:06

  • 21

交通標識の変化～ローマ字表記がなくなった？～

2020年3月10日 14:52

【コーディング】HTMLとCSSで作れる！見出しに使えるおしゃれな文字装飾サンプル

2018年3月12日 12:06

無料はどこまで？Googleマップの課金範囲

2019年1月31日 14:29

【2019年度版】中国の動画サイト、Youku(优酷）へ動画をアップロードする方法

2019年7月8日 10:19

業界情報やナレッジが詰まったメルマガ配信やソーシャルもよろしくです！
姉妹サイトもぜひ： ネッ担・ネッ担お悩み相談室

これは広告です

新着記事

はじめやすく、続けやすく――TVer・Fit Place 24・Duolingoに学ぶオンボーディング設計のヒント 7:00 モバイルファースト時代の到来 - 複雑化する広告運用にAIで立ち向かう［第4部 - 第50話］ 7:00 年間ボーナス平均額は「120.7万円」に急上昇、 最も高い職種は「法務／知的財産／特許」【週間ランキング】 11月19日 8:00 『機動戦士Gundam GQuuuuuuX』大成功の裏側　新旧ファンを同時に動かした“360度全方位”戦略 11月19日 7:00 “見える化”から始まる変革。SUBARU Webチームが挑んだデータ活用文化の浸透と、サイト運営の工夫 11月19日 7:00

人気記事トップ10

ボーナスが高い職種ランキング2025！ 年間ボーナス平均額は「120.7万円」に急上昇【パーソルキャリア調べ】 イオンが「電子マネーWAONポイント」を「WAON POINT」に統合、分かりにくさ解消 総務省が「ファイル共有ソフト」の不適切利用にあらためて注意を呼びかけ、特設ページ公開も アカチャンホンポで試供品を無料提供、アドインテのサンプリング自動販売機を活用 「推しアーティストランキング2025」発表！ 男性部門はSnow Man、女性部門はME:Iが1位に【エクシング調べ】 数字が苦手でも大丈夫！「生成AIデータ分析」超入門 『機動戦士Gundam GQuuuuuuX』大成功の裏側　新旧ファンを同時に動かした“360度全方位”戦略 “指標の言い換え”で成果を示す、ステークホルダーに通じるSEOの話し方（後編） 戦略の出発点は「顧客を知ること」 成果につながるマーケティングの進め方 D2Cが「docomo data squareジャーニー分析」提供開始、高度な消費者行動分析を実現
ボーナスが高い職種ランキング2025！ 年間ボーナス平均額は「120.7万円」に急上昇【パーソルキャリア調べ】 イオンが「電子マネーWAONポイント」を「WAON POINT」に統合、分かりにくさ解消 総務省が「ファイル共有ソフト」の不適切利用にあらためて注意を呼びかけ、特設ページ公開も アカチャンホンポで試供品を無料提供、アドインテのサンプリング自動販売機を活用 「推しアーティストランキング2025」発表！ 男性部門はSnow Man、女性部門はME:Iが1位に【エクシング調べ】 脱・自己流！ Excelではじめるデータ分析「聞くに聞けない」基本とスキル習得ロードマップ 戦略の出発点は「顧客を知ること」 成果につながるマーケティングの進め方 『機動戦士Gundam GQuuuuuuX』大成功の裏側　新旧ファンを同時に動かした“360度全方位”戦略 AI活用は「プロンプト」より「コンテキスト」？ セールスフォースが語る“AIエージェントの価値” AIで高品質なコンテンツは作れるか？ 品質を落とさず制作数を2.5倍にしたラクーンコマースのAI活用法
ボーナスが高い職種ランキング2025！ 年間ボーナス平均額は「120.7万円」に急上昇【パーソルキャリア調べ】 「推しアーティストランキング2025」発表！ 男性部門はSnow Man、女性部門はME:Iが1位に【エクシング調べ】 イオンが「電子マネーWAONポイント」を「WAON POINT」に統合、分かりにくさ解消 総務省が「ファイル共有ソフト」の不適切利用にあらためて注意を呼びかけ、特設ページ公開も アカチャンホンポで試供品を無料提供、アドインテのサンプリング自動販売機を活用 脱・自己流！ Excelではじめるデータ分析「聞くに聞けない」基本とスキル習得ロードマップ AI検索時代の「ゼロクリック問題」が深刻化？ noteでは“AI経由の流入”が急増【ヴァリューズ・note調べ】 AI活用は「プロンプト」より「コンテキスト」？ セールスフォースが語る“AIエージェントの価値” 2024年度「増収増益」企業は14.2万社、最多は建設業　石川・沖縄が上位に浮上【帝国データバンク調べ】 生成AIトラフィック、実は低CVR？ LLMによる購入決定の効果測定はまだ厳しいか【SEO情報まとめ】
人気記事ランキングをもっと見る

読者プレゼント

失敗しないサイト運営『オウンドメディアの教科書 成果につながる設計・運用・改善のすべて』を3名様にプレゼント 11月14日 10:00

企画広告も役立つ情報バッチリ！ Sponsored

AI時代のマーケターは「創る人」になる――クリエイティブから分析までを1人で完結させる4つの事例 11月14日 7:00 AIで高品質なコンテンツは作れるか？ 品質を落とさず制作数を2.5倍にしたラクーンコマースのAI活用法 11月13日 7:00 SEOは終わらない。AI検索時代に求められるGEOの現状と対策とは？ 10月16日 7:00 石巻市が実践した「災害に強いウェブサイト構築」〜自治体DX成功の舞台裏〜 10月14日 7:00 ユーザーは“来訪前後”に「何を検索していたのか？」 ガリバー流 顧客理解のためのマーケティング術 9月29日 7:00 競合分析は“シーン”で使い分ける　6パターン別・分析手法と仮説の立て方 9月1日 7:00 AI時代に「クソコンテンツ」は通用しない！ SEO評価と信頼性を両立する絶対条件 8月25日 7:00 LIFULLが語る！ 施策成功率280％UP、CV10倍を実現した「プロダクトアナリティクス」の全貌 7月29日 7:00 A/Bテストだけでは見えない「顧客インサイト」を発見し、継続的なサイト改善を実現する4ステップ 7月25日 7:00 生成AIで検索体験はどう変わる？ 導入事例から見るサイト内検索のいま 7月24日 7:00

編集部からのおしらせ

Web担当者Forum - 開発にあたって　開発スタッフと謝辞 11月18日 18:02 失敗しないサイト運営『オウンドメディアの教科書 成果につながる設計・運用・改善のすべて』を3名様にプレゼント 11月14日 10:00 ファンづくりの教科書『ファンダムマーケティング～「⁠今日の売上」と「明日の売上」を両立させる⁠～』を3名様にプレゼント 11月7日 10:00 11/7（金）まだ間に合う、本日開催の講演6つ！ AIで賢くサボる術/「読まれるコンテンツ」を作る技術など 11月7日 7:00 明日から活かせる！ AI時代のマーケティング戦略 〜実務者が知るべき成功のヒント〜 11月7日 7:00
すべて見る