軽量、シンプルで使いやすく様々なユーティリティも備えられたCSSフレームワーク・「Beercss」 Beercss See the Pen Untitled by kachibito (@kachibito) on CodePen. Beercssは軽量、シンプルで使いやすく様々なユーティリティも備えられたC...2022.01.22 | 9時52分34秒
タイプライター風のエフェクトを管理、実装できるスタイルシート・「Typed.css」 Typed.css Typed.cssはタイプライター風のエフェクトを管理、実装できるスタイルシートです。上のように文字が打ち込まれたように徐々に表示される的あエフェクトを管理できます。 テキストはcontentプロパティで管理...2022.01.17 | 9時48分06秒
目に見える部分のHTMLタグ全てにスタイリングされたclass不要のスタイルシート・「gd.css」 gd.css gd.cssは目に見える部分のHTMLタグ全てにスタイリングされたclass不要のスタイルシートです。CSSリセットの代替としても利用できるそう。 HTML要素だけでスタイリング可能な、いわゆるクラスレスなCSSで...2021.12.28 | 9時49分39秒
導入も楽々な手書き風のスタイリングが可能なスタイルシート・「doodle.css」 doodle.css doodle.cssは手書き風のスタイリングが可能なスタイルシートです。CSSを読み込んでbodyタグにclass="doodle"を付与するだけと導入も簡単です。テーマに近いものだと思います。 フォームや...2021.12.16 | 10時04分07秒
CSS製のボタンやチェックボックス、トグルボタンをその場で作成して共有できる・「cssbuttons.io」 cssbuttons.io cssbuttons.ioはCSS製のボタンやチェックボックス、トグルボタンをその場で作成して共有できるWebアプリです。 Githubのアカウントでログインすればエディタが使えるようになります。Co...2021.11.14 | 9時59分04秒
リンクやボタンなどに使えるピュアCSSアニメーションのコレクション・「Annimay」 Annimay Annimayはリンクやボタンなどに使えるピュアCSSアニメーションのコレクションです。 ボタン等でよく使われているのを見かけるアニメーションが一通りそろえられています。CSSファイルの他、SCSS、LESSもサ...2021.10.18 | 9時56分05秒
CSSファイルを読み込むだけで見た目を整えられるclass-lessなCSSフレームワーク・「AttriCSS」 AttriCSS See the Pen by kachibito (@kachibito) on CodePen. AttriCSSは読み込むだけで見た目を整えられるclass-lessなCSSフレーム...2021.09.10 | 9時52分00秒
任意の画像で様々な種類のCSS製フィルターを確認、気に入ったフィルターをクリックするとCSSコードをコピーできるWebアプリ・「FilterSS」 FilterSS FilterSSは任意の画像で様々な種類のCSS製フィルターを確認、気に入ったフィルターをクリックするとCSSコードをコピーできるWebアプリです。 現在42種のフィルターが用意されており、全てCSSで書かれて...2021.09.04 | 10時05分57秒
背景をボカして透過させるすりガラス風コンテンツを作成、CSSをコピーできる・「Glassmorphism CSS Generator」 Glassmorphism CSS Generator Glassmorphism CSS Generatorは背景をボカして透過させるすりガラス風コンテンツを作成、CSSをコピーできるWebアプリです。 Windows Vis...2021.07.23 | 10時07分54秒
CSS製のすりガラスを見た目を確認しながら作れるWebアプリ・「css.glass」 css.glass css.glassはCSS製のすりガラスを見た目を確認しながら作れるWebアプリです。上の様な、後方レイヤーにblurがかかるやつを簡単に作れるやつ。 設定をいじりながら作りたいすりガラスをつくってコードをコ...2021.06.21 | 10時05分35秒
Windows7のUIを再現できるスタイルシート・「7.css」 7.css See the Pen QWpzrZb by kachibito (@kachibito) on CodePen. 7.cssはWindows7のUIを再現できるスタイルシートです。98.css、XP.cs...2021.06.16 | 10時08分22秒
読み込むだけでアクセシビリティチェックを行えるCSS・「Checka11y.css」 Checka11y.css Checka11y.cssは読み込むだけでアクセシビリティチェックを行えるCSSです。 よくあるアクセシビリティチェックツールのと同等の精度かどうかは個人的には少し懐疑的ですがCSS製とあって非常に手...2021.06.10 | 10時03分58秒
カスタマイズ性と柔軟性を意識したセマンティックで扱いやすいフロントエンドフレームワーク・「Madosel」 Madosel Madoselはカスタマイズ性と柔軟性を意識したセマンティックで扱いやすいフロントエンドフレームワークです。 レイアウトや各所サイズ、マージンなどを細かくclassで用意したユーティリティメインのCSSフレームワ...2021.05.02 | 10時07分07秒
独自属性で任意のHTML要素に様々なアニメーション遷移エフェクトを付与できるスタイルシート・「transition.css」 transition.css transition.cssは独自属性で任意のHTML要素に様々なアニメーション遷移エフェクトを付与できるスタイルシートです。 CDNも用意されていますが、配布サイトで数値を調整してコードをコピーす...2021.04.01 | 9時53分27秒
任意のCSSアイコンから別のCSSアイコンへの遷移アニメーションのコードを提供する・「CSS ICON animate」 CSS ICON animate CSS ICON animateは任意のアイコンから別のアイコンへの遷移アニメーションを、アイコンも含めて全てCSSで作れるサービスです。 以前ご紹介した、CSSのみで出来たアイコン集のCSS ...2021.03.31 | 10時03分24秒
大量のコンポーネントが用意されたTailwindベースのUIキット・「TUK」 TUK TUKは大量のコンポーネントが用意されたTailwindベースのUIキットです。Tailwind.cssで設計された様々な手プレートやコンポーネントが用意されており、開発をサポートしてくれます。 全てのコンポーネントは主...2021.03.22 | 9時54分18秒
クラスレスでHTML要素に基本的なスタイルを適応するCSS・「Bamboo CSS」 Bamboo CSS See the Pen XWNqrRE by kachibito (@kachibito) on CodePen. Bamboo CSSはHTML要素に基本的なスタイルを適応するclass-les...2021.03.02 | 10時09分30秒
データ可視化に貢献するチャートCSSフレームワーク・「Charts.css」 Charts.css Charts.cssはデータ可視化のためのチャートCSSフレームワークです。HTMLによるデータビジュアライズの際にスタイリングをサポートするクラスを提供してくれます。 面や棒、折れ線、円やドーナツなどよく...2021.02.26 | 10時03分36秒
モダンなCSSを使ったレイアウトのコードスニペットを紹介する・「SmolCSS」 SmolCSS SmolCSSはモダンなCSSを使ったレイアウトのコードスニペットを紹介するプロジェクトサイトです。 古いCSSをモダンなCSSに置き換えるヒントを紹介するModern CSS Solutionsの運営者の方が始...2021.02.16 | 10時00分18秒
CSSやJavScript等の便利なコードスニペットを収集している・「DevSamples」 DevSamples DevSamplesはCSSやJavScript等の便利なコードスニペットを収集しているWebサイトです。 CSSやJS、Node、Git、ReactやSvelte、HTMLなど開発時にたびたびググりがちな...2021.02.12 | 10時06分58秒
ユーティリティファーストなCSSを設計するためのCSS変数を提供する・「Pollen」 Pollen Pollenは一貫したスタイルやユーティリティファーストなCSSを設計するためのCSS変数を提供するスタイルシートです。 中身は全てCSS変数のみで構成されており、既に定義付けられていますので、classを変えるこ...2021.02.07 | 10時06分00秒
高速開発を意識して開発されたミニマリストの為のCSSフレームワーク・「Luxa CSS」 Luxa CSS See the Pen XWNrxOG by kachibito (@kachibito) on CodePen. Luxa CSSは高速開発を意識して開発されたミニマリストの為のCSSフレームワーク...2021.01.29 | 10時03分52秒