Webデザイン

【2021年版】 Google Fontsの使い方とおすすめ日本語フォント

Webサイト・ブログにあると便利なGoogle Fonts(Googleフォント)の導入方法と使い方を初心者向けに解説します。

CSSで作成する吹き出しとデザインのアイデア

CSSとHTMLだけで作る吹き出しデザイン例と、吹き出しを簡単に作れるジェネレーターなど紹介します。

CSSグラデーションの作成に役立つジェネレーター・Webサービス11選

CSSグラデーションの制作に作成つジェネレーターや、サンプルやコレクションサイトをまとめて紹介します。

CSSだけで三角・矢印を作る方法

CSSのみで簡単に作れる三角・矢印のデザイン例です。基本的な作り方からテキストの文頭のアイコンまで紹介します。

背景や区切り線などを簡単に装飾できるCSSライブラリ「pattern.css」

クラスに指定するだけで背景パターン・区切り線・フォントなどを装飾することができるCSSライブラリ「pattern.css」の紹介です。

セクションの区切りをデザインできる「CSS Section Separator Generator」

HTMLとCSSでセクションのセパレーターを直感的にデザインできる「CSS Section Separator Generator」の紹介です。

CSSでよく使うレイアウト・パターンをまとめたサイト「CSS Layout」

Webサイト制作でポピュラーなCSS(レイアウト・フォーム・パターン)をコレクションした「CSS Layout」の紹介です。

Neumorphismを簡単に作れるジェネレーター「Neumorphism.io」

Neumorphismを直感的な操作で作れて、CSSのコードをコピーできるジェネレーター「Neumorphism.io」の紹介です。

マルチカラーグラデーションのコードをコピーできる「gradienta」

マルチカラーグラデーションのコードをコピー・画像(JPG)で保存できるWebサービス「gradienta」の紹介です。

簡単にホバーエフェクトを実装できるCSSライブラリ「Izmir Hover Effects」

組み合わせ次第で1000パターン以上のホバーエフェクトを実装できるCSSライブラリ「Izmir Hover Effects」の紹介です。

Font Awesomeをラインアイコンにしたアイコンセット「Line Awesome」

アイコンフォントで有名なFont Awesomeと互換性のあるラインアイコンセット「Line Awesome」を紹介します。

Web制作に役立つ素材をダウンロードできる「Freebies.ByPeople」

アイコン・フォント・HTML・WordpressのテーマまでWeb制作に役立つ素材を無料でダウンロードできる「Freebies.ByPeople」の紹介です。

Googleのプログラミング学習ツール「Grasshopper」にデスクトップ版がリリース

Googleのスマホ向けのプログラミング学習ツールのデスクトップ版「Grasshopper」がリリースされたので紹介します。

アイコンフォント「FontAwesome」の使い方

ブログやホームページなどでアイコンフォントを簡単に使うことができる「Font Awesome」を紹介します。

ポリゴンスタイルのイメージやテクスチャを生成できるジェネレーターまとめ

Webサイトのバックグラウンドやグラフィックデザインで使用できる、簡単な操作で生成できるポリゴンジェネレーターの紹介です。


RANDOM POST
  • Webサイト・スマホアプリなどのUIデザインギャラリー「UIPatternHub」
  • アイソメトリックなイラストを作成できるオンラインツール「Explore Isobuild」
  • 商用利用できるフリーフォントをまとめたサイト「weeklyfonts」
  • CSSグラデーションの作成に役立つジェネレーター・Webサービス11選
  • 【JS】要素をモーダルウィンドウに変化させる「cta.js」
  • フォントを調べる時に役に立つツール・サイト10選
POPULAR POSTS
  • 【2021年版】 無料で使えるフリーイラスト素材サイト36選(商用利用可)
  • 【2021年版】漢字が使える日本語フリーフォント80選
  • パーツを組み合わせてイラストを作成できる「Open Peeps」
  • フォントを調べる時に役に立つツール・サイト10選
  • 【2021年版】 Google Fontsの使い方とおすすめ日本語フォント
PICKUP
  • 無料で使えるおしゃれな英語の筆記体フリーフォント20選
  • CSSで実装するボタンデザインとホバーエフェクトのアイデア
  • 【2020年版】WordPressおすすめレンタルサーバー6選 -初心者向け-
  • 【2021年版】 無料で使えるフリー画像・写真素材サイト27選(国内/海外)
  • 【2021年版】 WordPressのおすすめテーマ17選(無料版/有料版)