管理栄養士と個人開発者の夫婦ブログ

ABOUT
おまめ
にゃんちゅう
料理・栄養
プログラミング
雑記
デザイン
ホテル・お店
コスメ
ブログ運営

サムネやWEBデザインに使える!メッシュグラデーションまとめ

2021-07-10個人開発1485

WEBデザインやサムネの作成に使えるメッシュグラデーションをまとめました。

Figmaにコピペで使える 「Boring Avatars」

Figmaを使える方にはこちらが一番おすすめです。 サイトからSVGをコピーして、Figmaにペーストすれば、そのまま使えます。 メッシュグラデーションの種類が豊富なだけでなく SVGでできているのが重要で、画質も気にせずFigma上で自分の好きなように調整が効きます。

gradient

右上の「RANDOM PALETTE」をクリックすれば生成されます。 角丸ならアバターとして使えて、四角で使えばサムネに使えます。 カラーパレットも変更可能。 グラデーション以外も生成してくれます。

洗練された 「100 Beautiful Mesh Gradients」

人の手で集められたシンプルなグラデーションが美しいです。 このレベルを自分で作ろうとすると調整が大変なので便利。 1024x1024pxのjpg形式でダウンロードできます。

gradient

虹色・パステル調グラデが映える 「ls.graphics」

まるでインスタグラムをイメージして作られたような、カラフルなグラデーションが綺麗です。 こちらは4000x3000pxで大きなサイズのjpgをダウンロードできるので、印刷物にも使えるサイズです。 gradient

ノイズ調整できる 「Noise & Gradient」

グラデーションにノイズをかけたい時もあります。 画像下の「ANOTHER」からグラデーションを生成できます。 サイズは1000x1000pxのjpgです。

gradient

この記事をシェアする

個人開発」のおすすめ記事も
読んでいってね!

Next/exportで編集可能なHTMLは作れないけど、FTPでも納品できる

2021-07-24 | おまめ

サムネやWEBデザインに使える!メッシュグラデーションまとめ

2021-07-10 | おまめ

FigmaでSVGを書き出してreact/typescriptでサクっと扱うSVGR

2021-02-14 | おまめ

Vercel + Contentful「Resource is limited」でデプロイできなくなった

2020-12-30 | おまめ

年内にもう一度読みたい!PM向けオススメ記事7選+α

2020-12-27 | おまめ

初心者がReact/Next.js + Vercelでブログ作るまで[1]

2020-11-14 | おまめ
おまめ
おまめ
夫。個人開発者・ブロガー・デザイナー。夫婦でサイドFIRE目指してます。