同心円を重ねたパターンを生成できるオンラインジェネレーター - Concentrics

同心円を重ねたさまざまなパターンを生成できるちょっと面白いオンラインジェネレーターを紹介します。

パターンのキャプチャ

Concentrics

ジェネレーターはHTML5 CanvasとJavaScriptで作成されており、簡単な操作でさまざまなパターンが生成できます。

パターンのキャプチャ

右パネルからパターンの設定ができます。

パターンのキャプチャ

設定パネル(上から、サイズ、スペース、カラー)

「Sizing」の値を全体的に大きくして、波状のパターンにしてみます。

パターンのキャプチャ

和風の波状のパターン

形状は円だけでなく、四角も利用できます。
「Use Squares」のチェックボックスをオンにします。

パターンのキャプチャ

四角を使ったパターン

生成したパターンは「Save」ボタンをクリックすると、PNG画像でダウンロードできます。
また、ジェネレーターのコードや同心円を描くJavaScriptも公開されています。

ジェネレーターでは、手元の画像とブレンドもできます。

パターンのキャプチャ

ただのバナナ画像

「Upload Image」から画像をアップロードして、パターンにブレンドします。

パターンのキャプチャ

バナナ画像とパターンをブレンド

top of page

©2017 coliss