Create a new document with appropriate dimensions for your animation. Make sure the color mode is set to RGB and resolution to 72 pixels/inch for standard web animations.
- What's new
-
Get started
- Technical requirements and installation
-
Learn the basics
- Adobe Photoshop on desktop FAQ
- Home screen overview
- Workspace overview
- Access the Discover panel
- Save custom workspaces
- Switch workspaces
- Delete workspaces
- Restore workspaces
- Boost workflows with the Contextual Task Bar
- Rearrange document windows
- Hide or show all panels
- Dock or undock panels
- Move panels
- Add and remove panels
- Stack floating panels
- Expand or collapse panel icons
- Change text size in panels and tooltips
- Use simple math in number fields
- High-density monitor support and per-monitor scaling
- Arrange and group panels
-
Set up toolbars and panels
- Customize toolbar
- Tooltips overview
- Create tool presets
- Use spring-loaded shortcuts
- Use Undo and Redo commands
- History panel settings
- Set History Log preferences
- View history logs
- Use snapshots in the History panel
- Paint with image states from the History panel
- Manage image states
- Restore parts of an image to a previous state
- Settings and preferences
- Generative AI in Photoshop
- Create, open, and import images
-
Create and manage layers
- Get started with layers
- Transform and manipulate layers
-
Color adjustment and fill layers
- Adjustment and fill layers overview
- Work with adjustment and fill layers
- Use layer masks to target adjustment or fill layers
- Create adjustment layers
- Merging adjustment or fill layers
- Adjustment presets overview
- Create custom presets
- Correct color balance with Color and vibrance
- Create fill layers
- Adjustment layer options
- Change adjustment and fill layer options
-
Apply layer effects
- Add layer styles
- Work with preset styles
- Layer style effects and options overview
- Manage preset styles
- Display or hide layer styles
- Copy and paste layer styles
- Import preset style libraries
- Manage contours
- Set a global lighting angle for all layers
- Scale layer effects
- Remove layer effects
- Work with layer styles
- Convert layer styles to image layers
-
Smart objects
- Smart Objects - overview and benefits
- Create embedded Smart Objects
- Create linked Smart Objects
- Update Linked Smart Objects
- View Linked Smart Object properties
- Embed Linked Smart Objects
- Package and locate linked Smart Objects
- Convert embedded Smart Objects to linked
- Filter the Layers panel by Smart Objects
- Duplicate an embedded Smart Object
- Edit the contents of a Smart Object
- Replace the contents of a Smart Object
- Convert Smart Objects to layers
- Rasterize Smart Objects
- Export the contents of an embedded Smart Object
- Reset Smart Object transforms
- Create layer compositions
- Layout and design tools
-
Crop, resize, and transform
-
Resize and adjust resolution
- Printed image resolution
- Set image size and resolution
- Resample option in the Image Size dialog
- Monitor resolution and image display size
- File size
- Printer resolution
- Resolution specs for printing images
- Preserve visual content when scaling images
- Specify content to protect when scaling
- Resize images
- Resampling options in Photoshop
- Change the pixel dimensions of images
- Change print dimensions and resolution
- Manage image file size
- Resizing parameters in Photoshop
- Crop and straighten
- Transform, manipulate, and reshape
-
Resize and adjust resolution
-
Make selections
- Get started with selections
-
Automatic and color-based selections
- Improve Select Subject and Remove Background results
- Make precise selections using Select People
- Remove objects with Delete and Fill Selection
- Improve hair selections with the Refine Hair tool
- Mask all objects in a layer
- Detect subject using Select Subject
- Paint a selection with Quick Selection tool
- Select areas by color with the Magic Wand tool
- Freehand selections
-
Refine and modify selections
- Move a selection or selection border
- Refine your selection and mask
- Hover layer bounds in the Move tool
- Copy and paste selections
- Create multiple copies of a selection within an image
- Paste one selection into or outside another
- Delete or cut selected pixels
- Control the movement of a selection
- Hide or show selection edges
- Inverse selection
- Adjust a selection manually
- Select only an area intersected by other selections
- Refine and soften selection edges
- Select pixels using anti-aliasing
- Define a feathered edge for a selection tool
- Create a selection around a selection border
- Expand or contract a selection
- Clean up stray pixels in a color-based selection
- Fringe pixels around a selection
- Decrease the fringe on a selection
- Remove a matte from a selection
- Create masks
-
Repair and retouch
-
Remove objects and fill space
- Remove background in your images
- Replace background with Generate Background
- Retouch tools overview
- Blend objects and people into any background with Harmonize
- Remove objects with Content-Aware Fill
- Adjust Content-Aware Fill settings
- Tools to fine-tune sampling and fill areas
- Apply or cancel Content-Aware fill changes
- View full-resolution preview in the Preview panel
- Heal and clone
- Adjust light and tone
-
Clean and restore images
- Enhance image quality with Generative Upscale
- Define planes to adjust perspective
- Manipulate the planes to adjust perspective
- Edit different perspectives in the same image
- Keyboard shortcuts to adjust perspective
- Get started with Photomerge
- Create panoramic images with Photomerge
- Create 360-degree panoramas
- Remove imperfections with the Spot Healing Brush
- Retouch a large area with the Healing Brush tool
- Repair an area with the Patch tool
- Remove red eye in flash photos
- Define an image as a preset pattern
- Erase parts of an image with the Eraser tool
- Auto Erase with the Pencil tool
- Create smoother brush strokes using stroke smoothing
- Change pixels to transparent with the Background Eraser tool
- Remove similar pixels with the Magic Eraser tool
-
Remove objects and fill space
-
Adjust color
- Color profiles
- Choose colors
- Color modes
- Color corrections
- Selective color adjustments
- Color effects and techniques
-
Apply painting techniques
- Fill objects, selections, and layers
- Create and fill with patterns
-
Brushes and presets
- Get started with brush presets
- Display the Brush Settings panel and brush options
- Create a brush tip from an image
- Create a brush and set painting options
- Select a preset brush
- Create a new preset brush
- Create preset brush groups
- Rename preset brushes
- Delete preset brushes
- Import brushes and brush packs
-
Draw shapes and paths
- Create shapes
- Draw lines and curves
-
Text and typography
- Get started with text
- Select and manage fonts
- Type layers and creation
- Text on paths and shapes
- Characters and glyphs
- International text and languages
-
Effects and filters
- Get started with filters
- Smart filters
- Blur and sharpen filters
-
Artistic and stylize filters
- Reshape and distort images with Transform Warp
- Warp a Layer with Cylindrical Transform
- Get precise distortions with Split Warp
- Distort specific image areas with Puppet Warp
- Overview of Liquify filter
- Overview of distortion tools
- Use Liquify to distort an image
- Freeze or thaw areas
- Work with meshes
- Work with backdrops
- Reconstruct distortions
- Replace the sky in images
- Select and manage sky presets
- Enhance images with generative AI filters
- Neural filters
-
Use grids and measurement guides
- Alignment grids and guides
- Measure and scale
-
Add video and animation
-
Create animation frames
- Create frame-based animations
- Add frames to animations
- Select animation frames
- Edit animation frames
- Unify layer properties in animation frames
- Copy frames with layer properties
- Create frames using tweening
- Manage layer visibility in animation frames
- Specify a delay time in frame animations
- Choose a frame disposal method
- Specify looping in frame animations
- Delete animations
- Use keyframes
-
Create animation frames
-
Automate tasks
- Create and record actions
- Process a batch of files
-
Save and export
- Save files
-
Export files to different formats
- Video and animation export formats
- Enhance animation frames
- Flatten frames into layers
- Export video files or image sequences
- Photoshop file formats overview
- File compression in Photoshop
- Supported file formats in Photoshop
- Image file formats supported in Photoshop
- Export your work using the Quick Export as option
- Fine-tune export settings with Export As
- Export settings and export location preferences
- Export files in different sizes
- Export layers as files
- Export artboards as PDF
- Export artboards as files
- Save and export to cloud
- Metadata, CSS, and content credentials
-
Share and collaborate
- Collaborate and edit
-
App integrations
- Access Adobe Express Templates
- Refine Firefly-generated images
- Workflows with Illustrator
- Transform image to video
-
Troubleshoot
- Troubleshoot tools and resources
- Performance and stability issues
- File and format issues
- Tool and feature issues
Create a timeline animation workflow
Last updated on
Oct 27, 2025
Learn more about creating a timeline-based animation in Photoshop using layers, keyframes, and the Timeline panel.
A. Playhead B. Timeline panel menu C. Add media to track D. Keyframe E. Zoom In F. Zoom slider G. Zoom Out H. Convert to frame animation I. Enable Keyframe animation J. Playback options
Open the Timeline panel by selecting Window > Timeline. If the panel shows frame animation mode, select the Convert to Video Timeline <insert icon here> icon in the lower-left corner.
Select Create Video Timeline from the drop-down menu, then click the button to the left of the arrow.
Add content by creating a new layer (Layer > New > Layer) or convert the background layer to a regular layer by double-clicking it in the Layers panel.
Set the timeline frame rate by selecting the Timeline panel menu and selecting Set Timeline Frame Rate.
Tip
Choose an appropriate rate such as 24 fps, which is standard for video.
Move the current-time indicator (the playhead) to where you want to set your first keyframe.
Expand the Layer properties by clicking the triangle next to the layer name, then select the Enable Keyframe animation icon next to the property you want to animate such as Position, Opacity, or Style.
Move the current-time indicator to a different point in time, then change the Layer property (move the layer, adjust opacity, etc.). Photoshop automatically creates a new keyframe.
Save your animation by selecting File > Export > Render Video for video output or File > Export > Save for Web (Legacy) for animated GIF.
Note
Preview your animation by selecting the Play button in the Timeline panel.
Create stunning images with Photoshop
Edit, retouch, and transform photos with the industry-leading creative tools you know and love.
