Tiling images - an overview of the principle

An image that can be copied and then have that copy abutted to the edge of any side of the original image and appear seamless (without any apparent edge between the images) is referred to as a tileable or seamless image.

Below is an example of a tileable image. There are nine identical images below. When they are joined together they appear to be one image. This is because each edge of the original image will blend into any edge of a copy of itself (if it is not rotated).

This type of image can be accomplished with some work using the Photoshop menu's Filter > Other > Offset

Resources & information about backgrounds and textures

NOTE that I am providing the following links as a service. However, I do not endorse, nor am I responsible for, the content at the following sites or any use made of them. Use them at your own risk. I did not create the text used for the names used for the links, therefore terms such as "Free" need to be confirmed by you, the user of the links. Your use of them is your responsibility and done at your discretion.

  1. Background Textures and Images Library, Free Download - GRSites
  2. Tile-able BGs
  3. Seamless image resource
  4. Free Textures from TextureKing
  5. Free High Resolution Textures - Lost and Taken
  6. Create Seamless Web Background Textures in Minutes | Design Shack
  7. Textures.com - Textures for 3D, graphic design and Photoshop
  8. Multiple Backgrounds with CSS
  9. CSS Gradients with "background-blend-mode" property (no IE support thru v.11)
  10. PatternBolt
  11. Responsive Full Background Image Using CSS
  12. Tile-able Website Backgrounds - Free Web Gallery
  13. Subtle Background Patterns | Free textures for your next web project.
  14. Stripe Generator - ajax diagonal stripes background designer
  15. CSS3 Multiple stacked backgrounds
    1. Mastering CSS3 Multiple Backgrounds
    2. Multiple Backgrounds with CSS3
    3. CSS3 Backgrounds
    4. Using CSS multiple backgrounds - Web developer guide | MDN
    5. Stacking Order of Multiple Backgrounds | CSS-Tricks
    6. Multiple Backgrounds with CSS3 - CSS3 . Info
  16. Scaling background images - Web developer guide | MDN
  17. For Web Designers - Website Design Resources
  18. CSS Backgrounds and Borders Module Level 3
  19. 100+ Seamless Patterns Great for Creating Website Backgrounds | Web Design Ledger