トップ

黒を基調としたサイトの背景に使えそうなパターン素材30選


格好良い雰囲気やシックな感じにしたいときよく使う色が黒色です。
同じ黒を基調としたデザインでも、背景によって雰囲気は全く異なってきます。
今回はそんな黒を基調としたデザインで使えるパターン素材を、シンプルなものからキュートなものまで集めてみました。

 

seamless_pattern_011

http://webtreats.mysitemyway.com/seamless-paper-patterns/

罫線や方眼紙などのシンプルなデザインのセットです。
モノクロ、緑、青の3色から選ぶことができるので、合わせやすくなっています。

 

3 Semaless Stripes

seamless_pattern_11

http://123freevectors.deviantart.com/art/Striped-Checked-Pattern-Vector-170662291

配色がオシャレなパターン素材です。
黒を基調とした中でも使いやすいデザインです。

 

45 Degrees Stripes Pattern

seamless_pattern_19

http://nagash.deviantart.com/art/45-Degrees-Stripes-Pattern-69891068

斜め45°に傾けたストライプで作られたデザインのみの素材です。
様々な種類のストライプが揃っています。

 

6 Vector Semaless Backgrounds Patterns

6-WALLPAPER

http://speckyboy.com/2010/04/08/6-free-vector-seamless-backgrounds-source-files/

エレガントな花柄の素材が6種類揃っています。
シックで高級感のあるデザインに仕上げてくれます。

 

200 Free Blurred Backgrounds – Blurgrounds

16571217-200-free-blurred-backgrounds-blurgrounds

http://dbfreebies.co/backgrounds

ライトが差し込んでいるようなデザインの素材です。
オシャレなデザインに活用できそうです。

 

Geometric Pattern Vectors

seamless_pattern_05

http://www.vecteezy.com/vector-art/63527-geometric-pattern-vectors

白黒のシンプルなパターン素材が100個揃っています。
雰囲気に合わせて色々と使い分けができそうですね。

 

10 SEAMLESS SUBTLE PATTERNS

original

http://www.bestpsdfreebies.com/freebie/10-seamless-photoshop-patterns/

質感をアップしてくれるシンプルな素材が揃っています。
シンプルだからこそ、色々なデザインに使いやすくなっています。

 

MUSTARD & BLACK PATTERNS

Copyright © Zooll.com Design by MysticEmma

http://zooll.com/goodies-mustard-black-patterns/

マスタードとブラックの2色で作られた素材です。
シンプルなものから特徴的なデザインまで揃っています。

 

NEON FISH SCALE PATTERNS

Copyright © Zooll.com Design by MysticEmma

http://zooll.com/neon-fish-scale-patterns/

ネオンカラーの魚のウロコデザインの素材です。
黒×ネオンカラーもオシャレなデザインになります。

 

HAND DRAWN PATTERNS

original (3)

http://jp.freepik.com/free-vector/hand-drawn-patterns_793845.htm

手書きで書かれたパターン素材です。
こういったデザインを背景にするだけでも、印象が大きく変わります。

 

BLACK AND WHITE PATTERNS

Copyright © Zooll.com Design by MysticEmma

http://zooll.com/goodies-black-and-white-patterns/

黒と白で作られたパターン素材です。
可愛らしいものからシンプルなものまで多様なデザインが揃っています。

 

Dribbble Backgrounds

582510-Dribbble-Backgrounds

http://dbfreebies.co/backgrounds

夜空のようなデザインの素材です。
こういった素材は何かと重宝されるものです。

 

Dice patterns

dice_patterns_by_jennistock

http://jennistock.deviantart.com/art/Dice-patterns-141832479

落ち着いた色味で作られたダイス型の素材です。
大人な印象を与えてくれるデザインになります。

 

Metal Mesh Patterns – Pack 1

metal_mesh_patterns___pack_1_by_axertion-d1s9l8c

http://axertion.deviantart.com/art/Metal-Mesh-Patterns-Pack-1-107942844

メタルで作られたメッシュ素材などのデザインが揃っています。
男性向けのデザインに活用できそうです。

 

Concrete Patterns

concrete_texture_patterns_by_silver_

http://silver-.deviantart.com/art/Concrete-Patterns-94125996

コンクリートの素材が12種類揃っています。
こちらもまた、男性向けのデザインに使えそうですね。

 

Tileable Starfield Patterns

tileable_starfield_patterns_by_webtreatsetc

http://jennistock.deviantart.com/art/Tileable-Starfield-Patterns-134349776

デザイン性のあるオシャレな素材です。
黒を基調としたデザインにも合わせやすい色味です。

 

Tileable Abstract Nebula

tileable_abstract_nebula_by_webtreatsetc

http://webtreatsetc.deviantart.com/art/Tileable-Abstract-Nebula-130541054

マーブル模様のデザインの素材が3種類セットになっています。
落ち着いた色味も特徴的です。

 

BICYCLES

pattern_09

http://thepatternlibrary.com/#bicycles

自転車のイラストで作られたパターン素材です。
よく見ると、自転車の形が普通じゃないのが面白いところです。

 

DARKWOOD

pattern_17

http://thepatternlibrary.com/#dark-wood

意外とあまり見ない黒い木目です。
ちょっと質感を変えたいときなどに使えそうですね。

 

JUNK MAIL

pattern_29

http://thepatternlibrary.com/#junk-mail

ノイズのようなイメージの素材です。
自分では作るのが大変なデザインの一つです。

 

RETRO FURNISH

pattern_46

http://thepatternlibrary.com/#retro-furnish

家具をモチーフに作られたパターン素材です。
黒を基調としていても、かわいらしい雰囲気に仕上げてくれます。

 

Grunge Star Patterns

grunge_star_patterns_by_webtreatsetc

http://webtreatsetc.deviantart.com/art/Grunge-Star-Patterns-123961237

ビンテージ風のデザイン素材です。
色味が落ち着いているので、黒色にも合わせやすそうです。

 

Subtle Dark Patterns Vol1

subtle-minimal-textures-and-patterns_11

http://www.pixeden.com/graphic-web-backgrounds/subtle-dark-patterns-vol1

シンプルなデザインのパターンが4種類セットになっています。
背景に少し素材感を出したいときに使えそうです。

 

MAZE

pattern_38

http://thepatternlibrary.com/#maze

迷路がモチーフとなっているデザイン素材です。
モノトーンでオシャレな仕上がりにしてくれそうですね。

 

Grayscale Patterns 1

f65323db6cdcf84b11d9564144afa36c-d3d12vi

http://webtreatsetc.deviantart.com/art/Grayscale-Patterns-1-203283918

黒をベースとしたシンプルな背景素材が揃っています。
どんなデザインでも合わせやすい素材です。

 

コンクリート打放しシームレスパターン素材

Concrete-Wall-pattern-set-768x480

http://free-texture.net/stone-metal/concrete-wall-pattern-set.html

コンクリートの打放しで作られた素材です。
幅の違うデザインが2種類セットになっています。

 

ブリキ(亜鉛メッキ)のテクスチャ素材01

galvanized-steel01-768x480

http://free-texture.net/stone-metal/galvanized-steel01.html

亜鉛メッキを施した素材です。
鉄を打ち込んだようなまだら模様が印象的です。

 

デニム生地のテクスチャ01

denim-fablic01-768x480

http://free-texture.net/etc-textures/denim-fablic01.html

黒いデニム生地の素材です。
ファッショナブルなデザインにしてくれそうですね。

 

Blue cybernetic abstract background

blue-cybernetic-abstract-background_293-1014

http://www.freepik.com/free-vector/blue-cybernetic-abstract-background_686738.htm#term=pattern&page=15&position=28

機械的なデザインのパターン素材です。
近未来的な印象を与えてくれます。

 

abstract stylish pattern backgrounds vector

abstract-stylish--pattern-backgrounds-vector_279-6588

http://www.freepik.com/free-vector/abstract-stylish–pattern-backgrounds-vector_684851.htm#term=pattern&page=16&position=30

ゴージャスな印象を与えてくれるデザインです。
細かいデザインも特徴的です。

 

さいごに

黒を基調としたデザインに使えそうな素材をご紹介しましたがいかがでしたでしょうか?
黒色と言っても背景の組み合わせによってはシックな雰囲気からゴージャスな雰囲気まで、デザインの幅はとても広いものです。ぜひイメージ通りの素材を見つけてくださいね。

本サイトが運営するWebデザインのオンラインスクールが公開中!
以下のリンクからお申込みで、特別料金の70%OFF!

未経験からプロのWebデザイナーになる! 400レッスン以上の完全マスターコース
こちらのコースは全くの未経験の方が、プロのWebデザイナーとして働けるレベルになることを目的としたコースです。
・全422レッスン & 42時間! 通学スクール80万円相当の内容
・授業×チャレンジ課題で実践的なスキルが身につく!
・過去1100名以上のスクール卒業生を輩出した、 Webサービス運営企業・デザイナー輩出企業だからこそ作れるプログラム

Webやアプリの最新デザインツール Sketch3 |100レッスンの完全マスターコース
Sketch3未経験からプロレベルを目指す、充実したコースです。
Sketch3の単なる機能説明をするような、つまらないコースではなく、アイコン制作、ボタン作成、メインビジュアル制作、Webページの制作など、実際の制作をしながら実践力を身につけます。
1000名以上の卒業生がいる実績ある日本のWebデザインスクールが提供しています。


Next Articleデザイナーを目指すなら知っておくべき!デザインの要素と原則まとめ