ツールを開く

SEAMLESS TEXTURE STUDIO無料ブラウザツール

写真から、
継ぎ目のない
テクスチャを。

壁、地面、布、木目。撮った写真のいい所を選ぶだけで、どこまで敷き詰めても継ぎ目が出ないタイル画像になります。

シームレステクスチャ工房は、写真からシームレステクスチャ(並べても境目の出ない画像)を作る無料のブラウザツールです。継ぎ目を消すだけでなく、明暗のムラや目立つ模様の「繰り返し感」まで目立たなくします。3DCG・ゲームの素材、Webや印刷物の背景に。インストールも登録もいりません。

テクスチャを作る 無料・インストール不要・登録不要

同じ写真の同じ範囲から作ったタイルを、それぞれ敷き詰めています。境目を左右に動かして比べられます。ドラッグで全体を動かすと、どこまでもつながっているのが分かります。

01 — Why

そのまま並べると、なぜバレるのか

写真の一部を切り抜いてそのまま敷き詰めると、すぐに「同じ画像の繰り返し」だと分かってしまいます。原因は大きく3つあり、シームレステクスチャ工房はそれぞれに別の手当てをします。

原因 1

端の段差(継ぎ目)

切り抜いた画像の右端と左端は、もともと離れた場所です。並べると境目で明るさや模様が食い違い、格子が浮かび上がります。

手当て端どうしを一番なじむ線で縫い合わせ、それでも残る段差は、タイル全体に少しずつ散らして消します。

原因 2

明暗のムラ

継ぎ目が消えても、タイルより大きな明暗の波が残ると、濃い所と薄い所が等間隔に並びます。遠くから見たときにいちばん目につくのがこれです。

手当て「ムラ取り」でタイルより大きな明暗の波だけを弱め、「照明を平らにする」で撮影時の光の傾きを取ります。

原因 3

一つだけ目立つ模様

しみ、節、石、汚れ。一つだけ目を引くものがあると、それが一定の間隔で現れ、目で追うだけで繰り返しが見つかります。

手当て目立つ所を避けて小片を並べ直し、残ったものは「消しブラシ」でなぞって、タイル内の似た場所に置き換えます。

02 — How to use

使い方は4手順

写真を入れた時点で、おまかせでタイルが一枚できあがります。あとは敷き詰めたプレビューを見ながら、気になる所だけ直していきます。

  1. STEP 1

    写真を選ぶ

    「画像を選ぶ」か、プレビューへドラッグ&ドロップ、コピーした画像の貼り付け(Ctrl / Cmd + V)で読み込みます。読み込むと、ムラが少なく質感のある場所を最大4つ探し、1番目の候補ですぐにタイルを作ります。手元に写真がなければ「見本で試す」からどうぞ。

  2. STEP 2

    範囲を決める

    左の元画像で、候補を選ぶか枠を描き直します。枠は動かす・広げる・回すのほか、「遠近を補正」で四隅を別々に動かして、斜めから撮った床や壁を正面向きに直せます。文字や汚れは「使わない所を塗る」で除けます。

  3. STEP 3

    繰り返しを隠す

    プレビュー下の「繰り返しの目立ちにくさ」の点数と、次に何をすればよいかの案内を見ながら、右の設定で仕上げます。ムラ取り、つなぎ方の変更、消しブラシ、バリエーション。動かすたびにプレビューが作り直されます。

  4. STEP 4

    保存する

    大きさ(512〜4096px)と形式(PNG・JPEG・WebP)を選んで保存します。バリエーションや付属マップなど複数のファイルは、1つのzipにまとめて保存します。スマートフォンでは、まとめて写真アプリへ保存することもできます。

03 — Methods

素材に合わせて、4つのつなぎ方

ふだんは「おまかせ」で十分です。写真の様子を見て、規則的な模様なら縫い合わせ、不規則な質感なら再構成、というように自動で選びます。思った仕上がりにならないときは、手で切り替えてください。下の作例は、どれもツールの「見本で試す」に入っている画像から作りました。

No.01しっくい壁512px

再構成

写真を小片に分けて並べ直し、切り口を一番なじむ線で縫います。元と配置が変わるので、繰り返しがいちばん隠れます。

向いている素材壁、土、砂利、芝、布、葉など不規則な質感

No.02れんが512px

縫い合わせ

模様の周期を探し、元の配置のまま端どうしを縫います。れんがの段や目地、織り目の並びが崩れません。

向いている素材れんが、タイル、石畳、織物、フェンスなど規則的な模様

No.03しっくい壁512px

なじませ

端を少しずつ重ねて溶かします。輪郭のはっきりしない画像なら、元の雰囲気をいちばん残せます。

向いている素材雲、空、霧、ぼけ足のある写真、グラデーション

No.04木目512px

鏡

上下左右(または片方だけ)に折り返します。必ずつながる代わりに、万華鏡のような対称の模様になります。

向いている素材対称の模様にしたいとき、装飾的な背景

そのまま並べた境目で段がずれ、目地が途切れる
縫い合わせ模様の周期に合わせて切るので、段も目地もつながる
04 — Hide the repeat

繰り返しを、目立たなくする工夫

継ぎ目が消えるのは出発点です。広い面に敷いても「同じ絵が並んでいる」と気づかれないように、いくつもの手当てを重ねられます。

ムラ取り

繰り返しにいちばん効くのがこれです。タイルより大きな明暗の波だけを弱めて、細かい質感は残します。「ムラの大きさ」を上げると、より細かいムラまで取ります。

  • 照明を平らにする切り出す前に、撮影時の光の傾き(片側だけ明るいなど)を取ります。
  • 飛び出しをならす周りと違いすぎる明暗の塊だけを抑えます。

縁のそろったバリエーション

外周の帯は同じまま、内側だけを張り替えたタイルを2・4・8枚作ります。どの2枚を隣に置いても継ぎ目が出ないので、ばらばらに並べれば同じ絵の繰り返しになりません。

ゲームエンジンのタイル配置や、ランダムに敷くシェーダーにそのまま使えます。ばらばらに並べた1枚の画像(2×2〜4×4)も書き出せて、それ自体もまた継ぎ目なく敷けます。れんがのような規則的な模様では、模様の周期に合わせてずらすので、段の並びは崩れません。

BRUSH

消しブラシ

目立つしみや節をなぞると、タイルの中から周りによくなじむ場所を探して置き換えます。「目立つ所を自動で消す」ボタンもあり、一つずつ戻せます。

AVOID

目立つ所を使わない

再構成で小片を選ぶとき、周りから浮いて見える場所を自動で避けます。元画像の上に塗って、使わない所を手で指定することもできます。

SCALE

タイルを広げる

再構成では、タイルを選んだ範囲の最大4倍まで広げられます。同じ絵柄が出てくる間隔が延びるほど、繰り返しは気づかれにくくなります。

TURN

小片の反転・回転

向きのない素材なら、小片を反転・回転させて使い、組み合わせを増やせます。光や木目に向きがある素材では切っておくのが無難です。

CHECK

見つけるための道具

タイルの境目を示す「格子」、ぼかして大きなムラを見せる「目を細める」、目に止まりやすい場所を赤く示す「目立つ箇所」。どこを直せばいいかが分かります。

SCORE

目立ちにくさの点数

明暗のムラや目立つ点の強さから、繰り返しの目立ちにくさを100点満点で表示し、次に効きそうな調整を案内します。仕上がりの目安にどうぞ。

05 — Preview

床に敷いて、確かめる

真上から見て問題なくても、床や壁として斜めに見ると、遠くで繰り返しが浮かんでくることがあります。ツールのプレビューは「平面」「床」「球」を切り替えられ、ドラッグで向きを変えながら確かめられます。

プレビューの周りは、色を正しく判断できるよう無彩色の中間グレーにしています。

06 — Export

書き出せるもの

タイルの大きさ
512 / 1024 / 2048 / 4096 pxスマートフォンでは2048pxまで
タイルの形
正方形 / 範囲に合わせる
形式
PNG / JPEG / WebPWebPに対応していないブラウザではPNG
バリエーション
なし / 2枚 / 4枚 / 8枚
敷き詰めた1枚
2×2 / 3×3 / 4×4
付属マップ
ノーマル / ハイト / ラフネス明るさを高さとみなす簡易版。PNGで保存
色の調整
明るさ / コントラスト / 彩度 / 色相 / 色温度
複数ファイル
1つのzipにまとめて保存スマートフォンでは、全部をまとめて共有して写真アプリへ保存することもできます
れんがのテクスチャ(カラー)
COLOR
れんがのノーマルマップ。青紫色で凹凸の向きを表している
NORMAL
れんがのハイトマップ。白いほど高い
HEIGHT
れんがのラフネスマップ
ROUGHNESS

付属マップもタイルと同じく継ぎ目なくつながります。ノーマルマップはOpenGL形式(緑が上向き)です。DirectX形式を使うソフトでは、緑チャンネルを反転して読み込んでください。

07 — Uses

こんな用途に

3DCG・ゲームの素材

床・壁・地面のマテリアルに。広い面に貼っても繰り返しが目立ちにくく、ノーマルマップなども一緒に用意できます。

Webサイトの背景

CSSの背景として小さな画像を繰り返し敷けば、軽いまま画面いっぱいに質感が出せます。

印刷物・パッケージ

紙や布、壁の質感を、ポスター・パッケージ・包装紙などの地紋に。4096pxなら印刷向けの大きな面にも敷き詰められます。

映像・配信の背景

スクロールさせても切れ目の出ない背景として。敷き詰めた1枚の書き出しも使えます。

08 — Tips

テクスチャ向きの写真を撮るコツ

どんな写真でもつなげられますが、元の写真が素直なほど、仕上がりは自然になります。

  1. 曇りの日や日陰で撮る強い日差しの影は向きがはっきり出るため、並べると不自然に見えます。光がまんべんなく当たっている状態が理想です。
  2. できるだけ正面から斜めになってしまったら、ツールの「遠近を補正」で四隅を合わせれば正面向きに直せます。
  3. 模様の単位が何回も入るようにれんがなら数段、石畳なら石が何個も入るくらい、広めに撮ると周期を見つけやすくなります。
  4. 一つだけ目立つものを避ける入ってしまったら、範囲から外すか、「使わない所を塗る」「消しブラシ」で除けます。
  5. 大きく書き出すなら画素も十分に4096pxで書き出す場合、選んだ範囲が小さいと引き伸ばすことになります。選んだ範囲の画素数は、元画像の見出しの横に表示されます。
09 — FAQ

よくある質問

利用は無料ですか?

無料です。会員登録・アプリのインストールも不要で、ブラウザで開くだけで使えます。書き出した画像にロゴやウォーターマークは入りません。

選んだ写真はサーバーにアップロードされますか?

されません。処理はすべてブラウザの中で完結し、写真や作ったテクスチャが端末の外へ送信されることはありません。

Photoshopの「スクロール(旧オフセット)」で継ぎ目を消す方法と何が違いますか?

画像を半分ずらして中央にできた継ぎ目をスタンプで消す方法は、継ぎ目は消せても、明暗のムラや目立つしみが等間隔に並ぶ「繰り返し感」は残りがちです。シームレステクスチャ工房は、継ぎ目を一番なじむ線で縫ったうえで、タイルより大きな明暗の波を弱めるムラ取り、目立つ所を避けた並べ直し、縁のそろったバリエーションまでを自動で行います。手作業のスタンプも、消しブラシでタイル内の似た場所から置き換えられます。

れんがやタイルのような規則的な模様にも使えますか?

使えます。つなぎ方の「縫い合わせ」は、模様の周期を探して元の配置のまま端どうしを縫うので、れんがの段や目地の並びが崩れません。「おまかせ」でも、規則的な模様と判断すると縫い合わせを選びます。バリエーションを作るときも、模様の周期に合わせてずらすので並びは保たれます。

どのくらいの大きさで保存できますか?

タイルの一辺は512・1024・2048・4096pxから選べます(スマートフォンでは2048pxまで)。形式はPNG・JPEG・WebPで、WebPに対応していないブラウザではPNGで保存します。2×2〜4×4に敷き詰めた1枚も書き出せます。

3DCGやゲーム用のノーマルマップも作れますか?

作れます。書き出しの設定で、ノーマル・ハイト・ラフネスの付属マップを同時に保存できます。写真の明るさを高さとみなして計算する簡易的なマップなので、凹凸の正確さが必要な場合は専用ソフトでの調整をおすすめします。付属マップもタイルと同じく継ぎ目なくつながります。ノーマルマップはOpenGL形式(緑が上向き)です。

スマートフォンでも使えますか?

使えます。WebGL2に対応したブラウザ(iOS 15以降のSafari、Android・PCのChrome / Firefox / Edgeなど)で動作します。範囲や四隅は指で動かせます。保存するときは共有シートや画像の長押しで写真アプリへ保存できます。バリエーションなど複数の画像も、まとめて共有して保存できます。

作ったテクスチャを商用利用できますか?

作ったテクスチャの権利は、元にした写真の権利に従います。ご自身で撮影した写真や、商用利用と加工が認められた素材であれば、商用でお使いいただけます。ツール側で追加の制限は設けていません。他者の著作物・商標・人物などが写っている写真を使う場合は、その権利者の許諾が必要です。詳しくは利用規約をご確認ください。

どこまで敷いても、
境目は見えない。

シームレステクスチャ工房を開く

免責事項

  • 本ツールの処理はすべてブラウザ内で完結し、読み込んだ写真や作成したテクスチャが外部サーバーへ送信・保存されることはありません。
  • 保存できる画像の大きさや一部の機能は、お使いのブラウザ・端末・バージョンによって制限される場合があります。本ツールは現状有姿で提供しており、動作を保証するものではありません。
  • 作成したテクスチャの内容および利用について、当方は責任を負いません。元にする写真の著作権・肖像権などの権利は、利用者ご自身でご確認ください。
  • 本ツールの利用により生じたいかなる損害(データの消失、機会損失、第三者との紛争等を含む)についても、当方は責任を負いません。
  • 本ページの作例は、ツールに入っている見本(プログラムで生成した画像)をシームレステクスチャ工房で処理したものです。
  • 仕様および本ページの内容は、予告なく変更される場合があります。ご利用にあたってはご利用規約をご確認ください。