background-svg

表示形式    

サイズと向き

  • 縦横比の維持
  •   
  •   
  •  px
  •  
  •   
  •  px
  •  
  •   
  •   回転
  •   
  • 間隔

  

  • 面の色
  •   
  • 面透過
  • 面の反転
  •     

背景色  

  • 背景の色
  •   

  

  • 線の色
  •   
  • 線透過
  • 線の幅
  • 線の位置
  •   
  •    

全体

  • 全透過

色の操作

  • 値:  
  •  
  • リンク
  • 赤の操作
  • 緑の操作
  • 青の操作

Information

項目をクリックするとここにヘルプが表示されます。


svgコード  byte  svgダウンロード

cssコード


コメント

波です。波縞といったほうがいいのかも知れません。
svgの話になりますが、この模様だと線幅(stroke-width)を太くした時の線の形状がなんかアレなんですよ。面(fill)を描くパスと線(stroke)を描くパスは別で用意していますが、この模様だと同じ位置に同じ二次ベジェ曲線で書いています。線幅を太くした時の曲線の形状は面の曲線の形状と一致しません。
strokeは難しいです。実はサイト作成を始める前はstrokeの操作を出来るようにしようとは考えていませんでした。ただそんな折、地元の美術館でやっていたアルフォンス・ミュシャ展を見にいって輪郭線の魅力にノックアウトされてしまいました。それでstrokeも操作出来るように作りました。