Preview how an image tiles as a repeating background and adjust seamless tiling with offset controls.
Image Tiling / Repeat Tool turns a selected image into a repeated two-dimensional preview. It shows neighboring copies together so you can inspect where the image's opposite edges meet, while offset controls let you reposition the pattern and examine different joins. The main surprise is that changing the offset does not make mismatched edges seamless. It only changes where those mismatches appear, so a join moved out of the center may still be visible elsewhere in the repeated area.
The selected image is treated as one rectangular tile. The preview places copies beside and below it, exposing the joins where the right edge meets the left edge and the bottom meets the top. Inspect several repetitions, because a mismatch may be clearer at one boundary than at another.
Offset controls change the registration of the repeated copies in the preview. Moving the pattern lets you place a join in an easy-to-inspect area and judge how motifs continue across tile boundaries. An offset changes where the repetition begins; it does not by itself supply matching color, texture, or geometry at opposing edges.
No. Offsetting can reveal a boundary more clearly or place the repeated motif at a preferable starting position, but it cannot reconcile edges that contain different colors, brightness, texture, or shapes. Those discrepancies must be corrected in the source tile before every repeated join can appear continuous.
The destination may display the tile at a different size or position. Resampling and fractional pixel placement can make edge pixels appear different even when the native-size preview looked clean. Check the destination's repeat direction, rendered tile size, and position, then compare it with the conditions under which you inspected the tile.
The behavioral notes were checked against the browser implementation. Standards and primary references below define the relevant format, formula, or platform behavior.
Pick colors visually and convert between HEX, RGB, HSL, and CMYK formats.
Preview how screen colors translate to print with CMYK simulation and proofing.
Preview any Google Font at various sizes, weights, and with custom sample text.
Create linear, radial, and conic CSS gradients with a visual editor and code output.
Generate harmonious color palettes from a base color using color theory rules.
Simulate how colors appear to people with various types of color vision deficiency.