
When you’re done, all of the images should appear lined up as if they were still one single image. Now that your image is separated into nice usable pieces, you will now need to “reassemble” them, so they appear as one single image again. Save your new image and return to your original full image.Ĭontinue with this process for each section that you want to cut up. Press Cmd+V (PC: Ctrl+V) to paste in the selection you just copied. The New dialogue box should automatically show the dimensions of the piece you just copied. Now, create a new blank document by pressing Cmd+N (PC: Ctrl+N). Once you have the area selected, press Cmd+C (PC: Ctrl+C) to copy the selection into memory.


You do not have to select every piece of the blue guides, only the parts that give you the desired size for your selection (notice in the below image how I skipped the 2 lines in the middle in order to select a “taller” section). Select the Rectangular Marquee tool and drag a selection box around the area of the image you wish to capture/cut out. Also, make sure that the Snap To Guides option in the View Menu is checked. If you plan on animating a small section of the image, make sure that you have that particular section marked to be cut out-this will reduce the overall file size of your image, because the whole image will not have to be loaded multiple times for the animation. Repeat the process until all of the areas you wish to cut up are surrounded by blue boxes (see image below). You should now have an image divided into four separate sections by the blue lines. Repeat this process, only this time from the ruler at the left of your image. You can adjust the position of the line by clicking and dragging on it with the Move tool. Let go of the cursor at the point where you want to make your incision. Step 2Ĭlick on the top Ruler and drag down with your cursor-a blue horizontal line should appear.

Make sure you drag the edges of the image out a bit so you have a bit of gray work area. Open up the image you intend to cut up and press Cmd+R (PC: Ctrl+R) to turn the document’s Rulers on. Note: If you have Adobe ImageReady (which comes with Photoshop 2.0 and above), the program can do all this automatically for you (including exporting HTML tables or CSS to reassemble the images on your page)… but if you don’t have ImageReady (or some program that can automate this task), follow along!
