webツール

WEBサイトの背景に使えるテクスチャ素材サイト8+1種!

こんにちは!satohmsysです

先日から新しく製作の案件がスタートし、ビジネスのターゲットが”女性”との事だったので、
うーん…と悩んだ結果ペールトーンで攻めたり…webフォントでゼロゴシック使ってメリハリつけたり…と色々悩んだのですが、イチバン悩んだのが背景でした。

そこで、悩みの中ネットサーフィンして見つけた、背景画像に使える、テクスチャ素材サイトをいくつかご紹介いたします!

Transparent Textures

Transparent-Textures

Transparent Textures

即時プレビュー、pngファイルダウンロード可能、シームレスパターン、CSSコード吐き出し。完璧です!

SUBTLE PATTERNS

subtlepatterns

SUBTLE PATTERNS

シームレスでミニマル。素材詳細ページでブラウザ上でプレビュー可能です。

早速ですが、ここで採用案を見つけました。

BGREPEAT

bgrepeat

BGREPEAT

ミニマルなものからガーリー、エレガントまで。

ブラウザプレビューは出来ませんが、デモ画面のHTMLは生成できます。意味がわかりません

FREE STOCK TEXTURES

freestocktextures

FREE STOCK TEXTURES

グランジ系やメタルなどガチな写真素材、CG系が多数。

たまにシームレスでリピートして使えるものもあり。DTPにも使えそうです!

フリー素材テクスチャ館

フリー素材テクスチャ館

フリー素材テクスチャ館

系統は様々ですがリアル質感系が多いのでしょうか。

zip形式でダウンロードでき、種類別と高解像度verとPhotoshopパターンファイル(.pat)が入っていて、webだけでなく、ハガキなど印刷物系にも使える、オススメサイトです。
素材詳細ページに日本語で解説付き。

Pattern8

pattern8

Pattern8

イラスト系多数。未だにTOPページの素材一覧にサンタ帽があるのが気になりますが、ダウンロードしたファイルも軽くて種類も多いので結構好きです。

Indigo Note

indigo note

Indigo Note

Fireworks向けの解説ですが、Photoshopでパターンを定義(画像を開いて 「編集(E) > パターンを定義」)してしまえば使えますし、
ちょっと面倒ですがIllustratorでもスウォッチ登録で使えます。

ダウンロードファイルはzip形式。解凍すると、サイズの種類が豊富に収録されていて使いやすそうです。

Fireworks Texture Gallery

Fireworks Texture Gallery

Fireworks Texture Gallery

こちらもIndigo Note様と同じくFireworks向け。

ベーシックなものが多いですね。ダウンロードは、直接「右クリック > 保存」 でOKとのこと

ホワイトや明るいグレーの質感をアップするテクスチャ素材のまとめ | コリス

ホワイトや明るいグレーの質感をアップするテクスチャ素材のまとめ | コリス

ホワイトや明るいグレーの質感をアップするテクスチャ素材のまとめ | コリス

シンプルに、さらっと使えてしまう系。

フリーの高解像度コルクテクスチャ素材とボード制作の簡単チュートリアル | DotsDomino

コルクボードの素材

番外編。

フリーの高解像度コルクテクスチャ素材とボード制作の簡単チュートリアル | DotsDomino

LPの制作でブレット(メリットを列挙すること)部分をデザインするときにありがちなのがコルクボード。
こちらのページにはよくお世話になっています。

とくにこちら!

コルクボードpsd

ページ中「Download」からダウロードしてください。
ピンやバッジの素材もセットです!そのまま使えます。

いかがでしょうか?
僕がお給料をもらっている間に苦し紛れにしたネットサーフィンが、誰かのお役に立てれば幸いです。

でわ!