KOENJP

ノイズ背景ジェネレーター

GRAIN · NOISE · SVG

単色やグラデーションにSVGのざらざらしたノイズ（グレイン）を重ね、CSSコードのコピーや、つなぎ目のないタイル・ノイズのみ・指定サイズのPNG保存ができます。すべてブラウザ内で処理します。

PREVIEW 質感のある背景 単色の背景に細かな粒子を重ねるだけで、印刷物のような温かみが出ます。
LOUPE · ZOOM
CSS 0 KB 

        


        

          
PNG

          

            
            
            

              

                
                ×
                
              

              
            

          

        

      

    

  










  

    

      HOW TO
      
使い方

      
    
      
  1. プリセットを選ぶか、背景を単色・グラデーションから選んで色を決めます。
    2. 
      
  2. ノイズの強さ・粒の大きさ・コントラスト・細かさを調整し、ブレンドモードを選びます。
    3. 
      
  3. プレビューとルーペで粒子の見え方を確認します。気に入らなければ「別のパターン」を押します。
    4. 
      
  4. 「CSSをコピー」でコードをコピーするか、タイル・ノイズのみ・指定サイズのPNGで保存します。
    5. 
      

    

    

      PAIRS WELL WITH
      
あわせて使いたいツール

      
    

  

  
  

    FAQ
    
よくある質問

    
作ったノイズ背景はWebサイトでそのまま使えますか？
はい。コピーしたCSSはSVGのノイズを埋め込んだデータURIなので、画像ファイルを用意しなくてもそのまま貼り付けて使えます。

    
タイルPNGとノイズのみPNGの違いは？
タイルPNGは背景色を含んだ画像で、並べてもつなぎ目が出ません。ノイズのみPNGは透明背景なので、デザインツールで好きな色の上に重ねて使えます。

    
画像はサーバーに送信されますか？
いいえ。ノイズの生成もPNGへの書き出しもすべてブラウザ内で行い、どこにも送信しません。