CSS アーカイブ | onocom.bookmark

Uix Kit | 美しいコンポーネントの詰まったウェブデザインキット

これ良さそう！ Bootstrap4と互換性もある美しいCSSフレームワーク。 MITライセンス。今度使ってみたい。サイトURL：https://uiux.cc/uix-kit/

視覚的でわかりやすくtransitionのcubic-bezierを生成できるサイト。サイトURL：https://cubic-bezier.com/

今風なCSSグラデーションを簡単にコピペで使えるページです。無料コレクションとのことなので、利用にあたって料金等は必要ないようです。 CSSのグラデーションに困ったり、デザインのグラデーションにこまったらこのサイトを参…

CSSのborderを駆使して三角形を作ることがたまにありますよね。そんな時に頼りになるCSS三角形ジェネレータです。サイトURL：http://apps.eky.hk/css-triangle-gen…

背景やちょっとしたアクセントに利用できるテクスチャパターンを提供しているサイト。無料で使えるが、CSSやHTMLにクレジットが必要とのこと。サイトURL：https://www.toptal.com/d…

サクッと使えて美しいグラデーションを作れるジェネレーターサイトURL：http://jxnblk.com/shade/

シンプルでミニマム（ファイルサイズが2KB）なCSSフレームーワーク。サイトURL：http://milligram.io/

サイトURL：http://lazylinepainter.info/

CSSグラデーションのジェネレータです。どれも美しいグラデーションのものばかり。参考になります。サイトURL：https://uigradients.com/#Greentodark

以下のブラウザをサポートしている。MITライセンス。 Google Chrome 25+ Mozilla Firefox 19+ Safari 6.0+ iOS Safari 4.0+ Opera 12.1+ Andro…

ダウンロードして、以下のようにスプリクトを読み込ませる。 <script src=”flexibility.js”></script> flexboxを利用したいCSSの記…

非常に豊富なコンポーネントが含まれたBootstrapのようなWEBサイト構築用フレームワーク。 Flexboxの仕組みが取り入れられている他、以下のようなコンポーネントが含まれている。 CAROUSEL CLOSE D…

JavaScript、CSS、HTMLの動作確認、シェアが簡単に行える。ブログ等への埋め込みも簡単！サイトURL：http://jsdo.it/

様々なエフェクトのCSSアニメーションが簡単に適用できるCSS。ライセンス：MITライセンス GitHub https://github.com/miniMAC/magic サイトURL：h…

BootstrapのようなCSS、JSフレームワーク。コンポーネントが豊富。おしゃれなサイトをつくるときなどに。 License: MIT サイトURL：http://framework.thememountain.c…

自分のサイトや指定したURLのサイトがモバイル対応出来ているか？モバイルフレンドリーかをチェックするサイト。 Googleが提供している。サイトURL：https://search.google.com/…

シンプルな記述でグラフが書けるCSS。ちょっとしたグラフが必要な時に活用できそう。サイトURL：https://theus.github.io/chart.css/#examples

英語フォントが多いけど、WebFont（ウェブフォント）が本当に身近になったなぁ。サイトURL：https://fonts.google.com/

Semantic UIというCSSフレームワークは良さそう。開発も続いている。 Bootstrapがだいぶ古臭くなってきたと感じた時にはこのフレームワークを使ってみるのも面白そう。数多くのUIコンポーネントを収録している…

Font Awesomeは徐々にアイコンが増えているし、制作でも重宝している。ただ、沢山のサイトが使っているがために、アイコンを使いすぎると陳腐な感じになっちゃうような気がするなぁ。 Font Awesomeのフォント…

bootstrapよりも高機能なフロントエンドフレームワーク。オープンソースとして公開されており、ライセンスはMITライセンス。 YOOthemeが開発をしており、どんどん改良を重ねられている。 flexboxなどの仕…