diff --git a/tutorials/2d/2d_sprite_animation.rst b/tutorials/2d/2d_sprite_animation.rst
index ee2853336ce..54dc884dccd 100644
--- a/tutorials/2d/2d_sprite_animation.rst
+++ b/tutorials/2d/2d_sprite_animation.rst
@@ -50,13 +50,13 @@ Now select the ``AnimatedSprite2D`` and in its *SpriteFrames* property, select
 Click on the new SpriteFrames resource and you'll see a new panel appear at the
 bottom of the editor window:
 
-.. image:: img/2d_animation_spriteframes.png
+.. image:: img/2d_animation_spriteframes.webp
 
 From the FileSystem dock on the left side, drag the 8 individual images into
 the center part of the SpriteFrames panel. On the left side, change the name
 of the animation from "default" to "run".
 
-.. image:: img/2d_animation_spriteframes_done.png
+.. image:: img/2d_animation_spriteframes_done.webp
 
 Back in the Inspector, check the box for the *Playing* property. You should
 now see the animation playing in the viewport. However, it is a bit slow. To
@@ -127,25 +127,25 @@ Set up your scene tree the same way you did previously when using individual ima
 
 Click on the new SpriteFrames resource. This time, when the bottom panel appears, select "Add frames from a Sprite Sheet".
 
-.. image:: img/2d_animation_add_from_spritesheet.png
+.. image:: img/2d_animation_add_from_spritesheet.webp
 
 You will be prompted to open a file. Select your sprite sheet.
 
 A new window will open, showing your sprite sheet. The first thing you will need to do is to change the number of vertical and horizontal images in your sprite sheet. In this sprite sheet, we have four images horizontally and two images vertically.
 
-.. image:: img/2d_animation_spritesheet_select_rows.png
+.. image:: img/2d_animation_spritesheet_select_rows.webp
 
 Next, select the frames from the sprite sheet that you want to include in your animation. We will select the top four, then click "Add 4 frames" to create the animation.
 
-.. image:: img/2d_animation_spritesheet_selectframes.png
+.. image:: img/2d_animation_spritesheet_selectframes.webp
 
 You will now see your animation under the list of animations in the bottom panel. Double click on default to change the name of the animation to jump.
 
-.. image:: img/2d_animation_spritesheet_animation.png
+.. image:: img/2d_animation_spritesheet_animation.webp
 
-Finally, check Playing on the AnimatedSprite2D in the inspector to see your frog jump!
+Finally, check the play button on the SpriteFrames editor to see your frog jump!
 
-.. image:: img/2d_animation_play_spritesheet_animation.png
+.. image:: img/2d_animation_play_spritesheet_animation.webp
 
 
 Sprite sheet with AnimationPlayer
diff --git a/tutorials/2d/img/2d_animation_add_from_spritesheet.png b/tutorials/2d/img/2d_animation_add_from_spritesheet.png
deleted file mode 100644
index 561c6fc71d6..00000000000
Binary files a/tutorials/2d/img/2d_animation_add_from_spritesheet.png and /dev/null differ
diff --git a/tutorials/2d/img/2d_animation_add_from_spritesheet.webp b/tutorials/2d/img/2d_animation_add_from_spritesheet.webp
new file mode 100644
index 00000000000..3db4eaa9f3e
Binary files /dev/null and b/tutorials/2d/img/2d_animation_add_from_spritesheet.webp differ
diff --git a/tutorials/2d/img/2d_animation_play_spritesheet_animation.png b/tutorials/2d/img/2d_animation_play_spritesheet_animation.png
deleted file mode 100644
index 2d1ca0ab6fb..00000000000
Binary files a/tutorials/2d/img/2d_animation_play_spritesheet_animation.png and /dev/null differ
diff --git a/tutorials/2d/img/2d_animation_play_spritesheet_animation.webp b/tutorials/2d/img/2d_animation_play_spritesheet_animation.webp
new file mode 100644
index 00000000000..87621bcb99a
Binary files /dev/null and b/tutorials/2d/img/2d_animation_play_spritesheet_animation.webp differ
diff --git a/tutorials/2d/img/2d_animation_spriteframes.png b/tutorials/2d/img/2d_animation_spriteframes.png
deleted file mode 100644
index f6731c711e6..00000000000
Binary files a/tutorials/2d/img/2d_animation_spriteframes.png and /dev/null differ
diff --git a/tutorials/2d/img/2d_animation_spriteframes.webp b/tutorials/2d/img/2d_animation_spriteframes.webp
new file mode 100644
index 00000000000..0d77b4ce753
Binary files /dev/null and b/tutorials/2d/img/2d_animation_spriteframes.webp differ
diff --git a/tutorials/2d/img/2d_animation_spriteframes_done.png b/tutorials/2d/img/2d_animation_spriteframes_done.png
deleted file mode 100644
index cd1585905bb..00000000000
Binary files a/tutorials/2d/img/2d_animation_spriteframes_done.png and /dev/null differ
diff --git a/tutorials/2d/img/2d_animation_spriteframes_done.webp b/tutorials/2d/img/2d_animation_spriteframes_done.webp
new file mode 100644
index 00000000000..9cf6b1990cf
Binary files /dev/null and b/tutorials/2d/img/2d_animation_spriteframes_done.webp differ
diff --git a/tutorials/2d/img/2d_animation_spritesheet_animation.png b/tutorials/2d/img/2d_animation_spritesheet_animation.png
deleted file mode 100644
index fae6904339d..00000000000
Binary files a/tutorials/2d/img/2d_animation_spritesheet_animation.png and /dev/null differ
diff --git a/tutorials/2d/img/2d_animation_spritesheet_animation.webp b/tutorials/2d/img/2d_animation_spritesheet_animation.webp
new file mode 100644
index 00000000000..c02e9e6cc14
Binary files /dev/null and b/tutorials/2d/img/2d_animation_spritesheet_animation.webp differ
diff --git a/tutorials/2d/img/2d_animation_spritesheet_select_rows.png b/tutorials/2d/img/2d_animation_spritesheet_select_rows.png
deleted file mode 100644
index d38ea63d7b7..00000000000
Binary files a/tutorials/2d/img/2d_animation_spritesheet_select_rows.png and /dev/null differ
diff --git a/tutorials/2d/img/2d_animation_spritesheet_select_rows.webp b/tutorials/2d/img/2d_animation_spritesheet_select_rows.webp
new file mode 100644
index 00000000000..d94307764b6
Binary files /dev/null and b/tutorials/2d/img/2d_animation_spritesheet_select_rows.webp differ
diff --git a/tutorials/2d/img/2d_animation_spritesheet_selectframes.png b/tutorials/2d/img/2d_animation_spritesheet_selectframes.png
deleted file mode 100644
index c8944b07dac..00000000000
Binary files a/tutorials/2d/img/2d_animation_spritesheet_selectframes.png and /dev/null differ
diff --git a/tutorials/2d/img/2d_animation_spritesheet_selectframes.webp b/tutorials/2d/img/2d_animation_spritesheet_selectframes.webp
new file mode 100644
index 00000000000..ac6b860e440
Binary files /dev/null and b/tutorials/2d/img/2d_animation_spritesheet_selectframes.webp differ
diff --git a/tutorials/animation/animation_track_types.rst b/tutorials/animation/animation_track_types.rst
index 1c0ebc13fd1..8ce377e53c8 100644
--- a/tutorials/animation/animation_track_types.rst
+++ b/tutorials/animation/animation_track_types.rst
@@ -11,38 +11,51 @@ player node on top of the default property tracks.
    We assume you already read :ref:`doc_introduction_animation`, which covers
    the basics, including property tracks.
 
-.. image:: img/track_types.png
+.. image:: img/track_types.webp
 
+Property Track
+--------------
 
-3D Transform Track
-------------------
+The most basic track type. See :ref:`doc_introduction_animation`.
+
+Position 3D / Rotation 3D / Scale 3D Track
+------------------------------------------
 
-3D transform tracks control the location, rotation, and scale of a 3D object.
+These 3D transform tracks control the location, rotation, and scale of a 3D object.
 They make it easier to animate a 3D object's transform compared to using regular
 property tracks.
 
-.. image:: img/3D_transform_track.png
+It is designed for animations imported from external 3D models and can reduce resource capacity through compression.
+
+Blend Shape Track
+-----------------
+
+A blend shape track is optimized for animating blend shape in :ref:`MeshInstance <class_MeshInstance>`:.
 
-Call Method tracks
+It is designed for animations imported from external 3D models and can reduce resource capacity through compression.
+
+Call Method Track
 ------------------
 
-Call method tracks allow you to call a function at a precise time from within an
+A call method track allow you to call a function at a precise time from within an
 animation. For example, you can call ``queue_free()`` to delete a node at the
 end of a death animation.
 
+.. note:: The events placed on the call method track are not executed when the animation is previewed in the editor for safety.
+
 To create such a track, click "Add Track -> Call Method Track." Then, a window
 opens and lets you select the node to associate with the track. To call one of
 the node's methods, right-click the timeline and select "Insert Key". A window
 opens with a list of available methods. Double-click one to finish creating the
 keyframe.
 
-.. image:: img/node_methods.png
+.. image:: img/node_methods.webp
 
 To change the method call or its arguments, click on the key and head to the
 inspector dock. There, you can change the method to call. If you expand the
 "Args" section, you will see a list of arguments you can edit.
 
-.. image:: img/node_method_args.png
+.. image:: img/node_method_args.webp
 
 Bezier Curve Track
 ------------------
@@ -50,27 +63,30 @@ Bezier Curve Track
 A bezier curve track is similar to a property track, except it allows you to
 animate a property's value using a bezier curve.
 
+.. note:: Bezier curve track and property track cannot be blended in :ref:`AnimationPlayer <class_AnimationPlayer>` and :ref:`AnimationTree <class_AnimationTree>`.
+
 To create one, click "Add Track -> Bezier Curve Track". As with property tracks,
 you need to select a node and a property to animate. To open the bezier curve
 editor, click the curve icon to the right of the animation track.
 
-.. image:: img/bezier_curve_icon.png
+.. image:: img/bezier_curve_icon.webp
 
-In the editor, keys are represented by white diamonds and the transparent
+In the editor, keys are represented by filled diamonds and the outlined
 diamonds connected to them by a line control curve's shape.
 
-.. image:: img/bezier_curves.png
+.. image:: img/bezier_curves.webp
 
-In the bottom-right of the editor, you can select the manipulator mode:
+In the right click panel of the editor, you can select the handle mode:
 
-- Free allows you to orient a manipulator in any direction without affecting the
+- Free: Allows you to orient a manipulator in any direction without affecting the
   other's position.
-- Balanced makes it so manipulators rotate together, but the distance between
+- Linear: Does not allow rotation of the manipulator and draws a linear graph.
+- Balanced: Makes it so manipulators rotate together, but the distance between
   the key and a manipulator is not mirrored.
-- Mirror makes the position of one manipulator perfectly mirror the other,
+- Mirrored: Makes the position of one manipulator perfectly mirror the other,
   including their distance to the key.
 
-.. image:: img/manipulator_modes.png
+.. image:: img/manipulator_modes.webp
 
 Audio Playback Track
 --------------------
@@ -84,13 +100,14 @@ To play a sound in your animation, drag and drop an audio file from the file
 system dock onto the animation track. You should see the waveform of your audio
 file in the track.
 
-.. image:: img/audio_track.png
+.. image:: img/audio_track.webp
 
 To remove a sound from the animation, you can right-click it and select "Delete
 Key(s)" or click on it and press the :kbd:`Del` key.
 
-.. note:: If you need to, you can create multiple audio tracks that trigger
-          playback on the same node.
+The blend mode allows you to choose whether or not to adjust the audio volume when blending in the :ref:`AnimationTree <class_AnimationTree>`.
+
+.. image:: img/blend_mode.webp
 
 Animation Playback Track
 ------------------------
@@ -107,7 +124,7 @@ Then, select the animation player you want to associate with the track.
 To add an animation to the track, right-click on it and insert a key. Select the
 key you just created to select an animation in the inspector dock.
 
-.. image:: img/animation_player_animation.png
+.. image:: img/animation_player_animation.webp
 
 If an animation is already playing and you want to stop it early, you can create
 a key and have it set to `[STOP]` in the inspector.
diff --git a/tutorials/animation/animation_tree.rst b/tutorials/animation/animation_tree.rst
index 01fa1ff4dad..820fad8ed1e 100644
--- a/tutorials/animation/animation_tree.rst
+++ b/tutorials/animation/animation_tree.rst
@@ -60,7 +60,7 @@ Blend tree
 
 An ``AnimationNodeBlendTree`` can contain both root and regular nodes used for blending. Nodes are added to the graph from a menu:
 
-.. image:: img/animtree3.png
+.. image:: img/animtree3.webp
 
 All blend trees contain an ``Output`` node by default, and something has to be connected to it in order for animations to play.
 
@@ -93,33 +93,64 @@ This node will execute a sub-animation and return once it finishes. Blend times
 
 .. image:: img/animtree6b.gif
 
-Seek
-^^^^
+After setting the request and changing the animation playback, the one-shot node automatically clears the request on the next process frame by setting its [code]request[/code] value to [constant ONE_SHOT_REQUEST_NONE].
+
+.. tabs::
+ .. code-tab:: gdscript GDScript
+
+    # Play child animation connected to "shot" port.
+    animation_tree.set("parameters/OneShot/request", AnimationNodeOneShot.ONE_SHOT_REQUEST_FIRE)
+    # Alternative syntax (same result as above).
+    animation_tree["parameters/OneShot/request"] = AnimationNodeOneShot.ONE_SHOT_REQUEST_FIRE
+
+    # Abort child animation connected to "shot" port.
+    animation_tree.set("parameters/OneShot/request", AnimationNodeOneShot.ONE_SHOT_REQUEST_ABORT)
+    # Alternative syntax (same result as above).
+    animation_tree["parameters/OneShot/request"] = AnimationNodeOneShot.ONE_SHOT_REQUEST_ABORT
+
+    # Get current state (read-only).
+    animation_tree.get("parameters/OneShot/active"))
+    # Alternative syntax (same result as above).
+    animation_tree["parameters/OneShot/active"]
+
+ .. code-tab:: csharp
+
+    // Play child animation connected to "shot" port.
+    animationTree.Set("parameters/OneShot/request", AnimationNodeOneShot.ONE_SHOT_REQUEST_FIRE);
+
+    // Abort child animation connected to "shot" port.
+    animationTree.Set("parameters/OneShot/request", AnimationNodeOneShot.ONE_SHOT_REQUEST_ABORT);
+
+    // Get current state (read-only).
+    animationTree.Get("parameters/OneShot/active");
+
+TimeSeek
+^^^^^^^^
 
 This node can be used to cause a seek command to happen to any sub-children of the animation graph. Use this node type to play an ``Animation`` from the start or a certain playback position inside the ``AnimationNodeBlendTree``.
 
-After setting the time and changing the animation playback, the seek node automatically goes into sleep mode on the next process frame by setting its ``seek_position`` value to ``-1.0``.
+After setting the time and changing the animation playback, the seek node automatically goes into sleep mode on the next process frame by setting its ``seek_request`` value to ``-1.0``.
 
 .. tabs::
  .. code-tab:: gdscript GDScript
 
     # Play child animation from the start.
-    anim_tree.set("parameters/Seek/seek_position", 0.0)
+    animation_tree.set("parameters/TimeSeek/seek_request", 0.0)
     # Alternative syntax (same result as above).
-    anim_tree["parameters/Seek/seek_position"] = 0.0
+    animation_tree["parameters/TimeSeek/seek_request"] = 0.0
 
     # Play child animation from 12 second timestamp.
-    anim_tree.set("parameters/Seek/seek_position", 12.0)
+    animation_tree.set("parameters/TimeSeek/seek_request", 12.0)
     # Alternative syntax (same result as above).
-    anim_tree["parameters/Seek/seek_position"] = 12.0
+    animation_tree["parameters/TimeSeek/seek_request"] = 12.0
 
  .. code-tab:: csharp
 
     // Play child animation from the start.
-    animTree.Set("parameters/Seek/seek_position", 0.0);
+    animationTree.Set("parameters/TimeSeek/seek_request", 0.0);
 
     // Play child animation from 12 second timestamp.
-    animTree.Set("parameters/Seek/seek_position", 12.0);
+    animationTree.Set("parameters/TimeSeek/seek_request", 12.0);
 
 TimeScale
 ^^^^^^^^^
@@ -130,6 +161,36 @@ Transition
 ^^^^^^^^^^
 
 Very simple state machine (when you don't want to cope with a ``StateMachine`` node). Animations can be connected to the outputs and transition times can be specified.
+After setting the request and changing the animation playback, the transition node automatically clears the request on the next process frame by setting its [code]transition_request[/code] value to empty.
+
+.. tabs::
+ .. code-tab:: gdscript GDScript
+
+    # Play child animation connected to "state_2" port.
+    animation_tree.set("parameters/Transition/transition_request", "state_2")
+    # Alternative syntax (same result as above).
+    animation_tree["parameters/Transition/transition_request"] = "state_2"
+
+    # Get current state name (read-only).
+    animation_tree.get("parameters/Transition/current_state")
+    # Alternative syntax (same result as above).
+    animation_tree["parameters/Transition/current_state"]
+
+    # Get current state index (read-only).
+    animation_tree.get("parameters/Transition/current_index"))
+    # Alternative syntax (same result as above).
+    animation_tree["parameters/Transition/current_index"]
+
+ .. code-tab:: csharp
+
+    // Play child animation connected to "state_2" port.
+    animationTree.Set("parameters/Transition/transition_request", "state_2");
+
+    // Get current state name (read-only).
+    animationTree.Get("parameters/Transition/current_state");
+
+    // Get current state index (read-only).
+    animationTree.Get("parameters/Transition/current_index");
 
 BlendSpace2D
 ^^^^^^^^^^^^
@@ -247,11 +308,27 @@ Afterwards, the actual motion can be retrieved via the :ref:`AnimationTree <clas
 .. tabs::
  .. code-tab:: gdscript GDScript
 
-    anim_tree.get_root_motion_transform()
+    # Get the motion delta.
+    animation_tree.get_root_motion_position()
+    animation_tree.get_root_motion_rotation()
+    animation_tree.get_root_motion_scale()
+
+    # Get the actual blended value of the animation.
+    animation_tree.get_root_motion_position_accumulator()
+    animation_tree.get_root_motion_rotation_accumulator()
+    animation_tree.get_root_motion_scale_accumulator()
 
  .. code-tab:: csharp
 
-    animTree.GetRootMotionTransform();
+    // Get the motion delta.
+    animationTree.GetRootMotionPosition();
+    animationTree.GetRootMotionRotation();
+    animationTree.GetRootMotionScale();
+
+    // Get the actual blended value of the animation.
+    animationTree.GetRootMotionPositionAccumulator();
+    animationTree.GetRootMotionRotationAccumulator();
+    animationTree.GetRootMotionScaleAccumulator();
 
 This can be fed to functions such as :ref:`CharacterBody3D.move_and_slide <class_CharacterBody3D_method_move_and_slide>` to control the character movement.
 
@@ -260,7 +337,6 @@ character and animations (this node is disabled by default during the game).
 
 .. image:: img/animtree15.gif
 
-
 Controlling from code
 ---------------------
 
@@ -288,14 +364,13 @@ Which allows setting them or reading them:
 .. tabs::
  .. code-tab:: gdscript GDScript
 
-    anim_tree.set("parameters/eye_blend/blend_amount", 1.0)
+    animation_tree.set("parameters/eye_blend/blend_amount", 1.0)
     # Simpler alternative form:
-    anim_tree["parameters/eye_blend/blend_amount"] = 1.0
+    animation_tree["parameters/eye_blend/blend_amount"] = 1.0
 
  .. code-tab:: csharp
 
-    animTree.Set("parameters/eye_blend/blend_amount", 1.0);
-
+    animationTree.Set("parameters/eye_blend/blend_amount", 1.0);
 
 State machine travel
 --------------------
@@ -308,15 +383,14 @@ to the destination state.
 To use the travel ability, you should first retrieve the :ref:`AnimationNodeStateMachinePlayback <class_AnimationNodeStateMachinePlayback>`
 object from the ``AnimationTree`` node (it is exported as a property).
 
-
 .. tabs::
  .. code-tab:: gdscript GDScript
 
-    var state_machine = anim_tree["parameters/playback"]
+    var state_machine = animation_tree["parameters/playback"]
 
  .. code-tab:: csharp
 
-    AnimationNodeStateMachinePlayback stateMachine = (AnimationNodeStateMachinePlayback)animTree.Get("parameters/playback");
+    AnimationNodeStateMachinePlayback stateMachine = (AnimationNodeStateMachinePlayback)animationTree.Get("parameters/playback");
 
 Once retrieved, it can be used by calling one of the many functions it offers:
 
diff --git a/tutorials/animation/img/3D_transform_track.png b/tutorials/animation/img/3D_transform_track.png
deleted file mode 100644
index 658ac7be355..00000000000
Binary files a/tutorials/animation/img/3D_transform_track.png and /dev/null differ
diff --git a/tutorials/animation/img/animation_animation_panel.png b/tutorials/animation/img/animation_animation_panel.png
deleted file mode 100644
index 00d99896ae0..00000000000
Binary files a/tutorials/animation/img/animation_animation_panel.png and /dev/null differ
diff --git a/tutorials/animation/img/animation_animation_panel.webp b/tutorials/animation/img/animation_animation_panel.webp
new file mode 100644
index 00000000000..9ba4c1530a8
Binary files /dev/null and b/tutorials/animation/img/animation_animation_panel.webp differ
diff --git a/tutorials/animation/img/animation_animation_panel_overview.png b/tutorials/animation/img/animation_animation_panel_overview.png
deleted file mode 100644
index ee5f4372a5e..00000000000
Binary files a/tutorials/animation/img/animation_animation_panel_overview.png and /dev/null differ
diff --git a/tutorials/animation/img/animation_animation_panel_overview.webp b/tutorials/animation/img/animation_animation_panel_overview.webp
new file mode 100644
index 00000000000..2e7549ca10d
Binary files /dev/null and b/tutorials/animation/img/animation_animation_panel_overview.webp differ
diff --git a/tutorials/animation/img/animation_create_animationplayer.png b/tutorials/animation/img/animation_create_animationplayer.png
deleted file mode 100644
index 7e330fd4dfb..00000000000
Binary files a/tutorials/animation/img/animation_create_animationplayer.png and /dev/null differ
diff --git a/tutorials/animation/img/animation_create_animationplayer.webp b/tutorials/animation/img/animation_create_animationplayer.webp
new file mode 100644
index 00000000000..a94b558fe20
Binary files /dev/null and b/tutorials/animation/img/animation_create_animationplayer.webp differ
diff --git a/tutorials/animation/img/animation_create_new_animation.png b/tutorials/animation/img/animation_create_new_animation.png
deleted file mode 100644
index 3c38a1e8847..00000000000
Binary files a/tutorials/animation/img/animation_create_new_animation.png and /dev/null differ
diff --git a/tutorials/animation/img/animation_create_new_animation.webp b/tutorials/animation/img/animation_create_new_animation.webp
new file mode 100644
index 00000000000..2f5684321f1
Binary files /dev/null and b/tutorials/animation/img/animation_create_new_animation.webp differ
diff --git a/tutorials/animation/img/animation_keyframe_editor_key.png b/tutorials/animation/img/animation_keyframe_editor_key.png
deleted file mode 100644
index 1bcd9645d85..00000000000
Binary files a/tutorials/animation/img/animation_keyframe_editor_key.png and /dev/null differ
diff --git a/tutorials/animation/img/animation_keyframe_editor_key.webp b/tutorials/animation/img/animation_keyframe_editor_key.webp
new file mode 100644
index 00000000000..af1b5e2b32c
Binary files /dev/null and b/tutorials/animation/img/animation_keyframe_editor_key.webp differ
diff --git a/tutorials/animation/img/animation_library.webp b/tutorials/animation/img/animation_library.webp
new file mode 100644
index 00000000000..1b0ea36e0ab
Binary files /dev/null and b/tutorials/animation/img/animation_library.webp differ
diff --git a/tutorials/animation/img/animation_library_dialog.webp b/tutorials/animation/img/animation_library_dialog.webp
new file mode 100644
index 00000000000..05709a20139
Binary files /dev/null and b/tutorials/animation/img/animation_library_dialog.webp differ
diff --git a/tutorials/animation/img/animation_player_animation.png b/tutorials/animation/img/animation_player_animation.png
deleted file mode 100644
index 31585aecc6f..00000000000
Binary files a/tutorials/animation/img/animation_player_animation.png and /dev/null differ
diff --git a/tutorials/animation/img/animation_player_animation.webp b/tutorials/animation/img/animation_player_animation.webp
new file mode 100644
index 00000000000..07187567e6d
Binary files /dev/null and b/tutorials/animation/img/animation_player_animation.webp differ
diff --git a/tutorials/animation/img/animation_properties_keyframe.png b/tutorials/animation/img/animation_properties_keyframe.png
deleted file mode 100644
index c8b7800449b..00000000000
Binary files a/tutorials/animation/img/animation_properties_keyframe.png and /dev/null differ
diff --git a/tutorials/animation/img/animation_properties_keyframe.webp b/tutorials/animation/img/animation_properties_keyframe.webp
new file mode 100644
index 00000000000..f48eb1ee620
Binary files /dev/null and b/tutorials/animation/img/animation_properties_keyframe.webp differ
diff --git a/tutorials/animation/img/animation_track.png b/tutorials/animation/img/animation_track.png
deleted file mode 100644
index 58a1e1a68e2..00000000000
Binary files a/tutorials/animation/img/animation_track.png and /dev/null differ
diff --git a/tutorials/animation/img/animation_track.webp b/tutorials/animation/img/animation_track.webp
new file mode 100644
index 00000000000..d0bc08c8c8c
Binary files /dev/null and b/tutorials/animation/img/animation_track.webp differ
diff --git a/tutorials/animation/img/animation_track_interpolation.png b/tutorials/animation/img/animation_track_interpolation.png
deleted file mode 100644
index a6a13b3a492..00000000000
Binary files a/tutorials/animation/img/animation_track_interpolation.png and /dev/null differ
diff --git a/tutorials/animation/img/animation_track_interpolation.webp b/tutorials/animation/img/animation_track_interpolation.webp
new file mode 100644
index 00000000000..aa41eeba0e0
Binary files /dev/null and b/tutorials/animation/img/animation_track_interpolation.webp differ
diff --git a/tutorials/animation/img/animation_track_loop_modes.png b/tutorials/animation/img/animation_track_loop_modes.png
deleted file mode 100644
index f6476c0cf28..00000000000
Binary files a/tutorials/animation/img/animation_track_loop_modes.png and /dev/null differ
diff --git a/tutorials/animation/img/animation_track_loop_modes.webp b/tutorials/animation/img/animation_track_loop_modes.webp
new file mode 100644
index 00000000000..62ae697c691
Binary files /dev/null and b/tutorials/animation/img/animation_track_loop_modes.webp differ
diff --git a/tutorials/animation/img/animation_track_rate.png b/tutorials/animation/img/animation_track_rate.png
deleted file mode 100644
index 7c8f96e95ab..00000000000
Binary files a/tutorials/animation/img/animation_track_rate.png and /dev/null differ
diff --git a/tutorials/animation/img/animation_track_rate.webp b/tutorials/animation/img/animation_track_rate.webp
new file mode 100644
index 00000000000..8ebcbc3be66
Binary files /dev/null and b/tutorials/animation/img/animation_track_rate.webp differ
diff --git a/tutorials/animation/img/animation_track_settings.png b/tutorials/animation/img/animation_track_settings.png
deleted file mode 100644
index 7312c55f61e..00000000000
Binary files a/tutorials/animation/img/animation_track_settings.png and /dev/null differ
diff --git a/tutorials/animation/img/animation_track_settings.webp b/tutorials/animation/img/animation_track_settings.webp
new file mode 100644
index 00000000000..ae0b5cc187a
Binary files /dev/null and b/tutorials/animation/img/animation_track_settings.webp differ
diff --git a/tutorials/animation/img/animtree3.png b/tutorials/animation/img/animtree3.png
deleted file mode 100644
index f81eb757d46..00000000000
Binary files a/tutorials/animation/img/animtree3.png and /dev/null differ
diff --git a/tutorials/animation/img/animtree3.webp b/tutorials/animation/img/animtree3.webp
new file mode 100644
index 00000000000..d72cc4db322
Binary files /dev/null and b/tutorials/animation/img/animtree3.webp differ
diff --git a/tutorials/animation/img/audio_track.png b/tutorials/animation/img/audio_track.png
deleted file mode 100644
index 2494572ecc7..00000000000
Binary files a/tutorials/animation/img/audio_track.png and /dev/null differ
diff --git a/tutorials/animation/img/audio_track.webp b/tutorials/animation/img/audio_track.webp
new file mode 100644
index 00000000000..36fa3925285
Binary files /dev/null and b/tutorials/animation/img/audio_track.webp differ
diff --git a/tutorials/animation/img/bezier_curve_icon.png b/tutorials/animation/img/bezier_curve_icon.png
deleted file mode 100644
index f12a06de1f0..00000000000
Binary files a/tutorials/animation/img/bezier_curve_icon.png and /dev/null differ
diff --git a/tutorials/animation/img/bezier_curve_icon.webp b/tutorials/animation/img/bezier_curve_icon.webp
new file mode 100644
index 00000000000..993ca679e01
Binary files /dev/null and b/tutorials/animation/img/bezier_curve_icon.webp differ
diff --git a/tutorials/animation/img/bezier_curves.png b/tutorials/animation/img/bezier_curves.png
deleted file mode 100644
index 2a20315b243..00000000000
Binary files a/tutorials/animation/img/bezier_curves.png and /dev/null differ
diff --git a/tutorials/animation/img/bezier_curves.webp b/tutorials/animation/img/bezier_curves.webp
new file mode 100644
index 00000000000..5b6f2dfa9e2
Binary files /dev/null and b/tutorials/animation/img/bezier_curves.webp differ
diff --git a/tutorials/animation/img/blend_mode.webp b/tutorials/animation/img/blend_mode.webp
new file mode 100644
index 00000000000..034730c4c0b
Binary files /dev/null and b/tutorials/animation/img/blend_mode.webp differ
diff --git a/tutorials/animation/img/manipulator_modes.png b/tutorials/animation/img/manipulator_modes.png
deleted file mode 100644
index 843e44f98e7..00000000000
Binary files a/tutorials/animation/img/manipulator_modes.png and /dev/null differ
diff --git a/tutorials/animation/img/manipulator_modes.webp b/tutorials/animation/img/manipulator_modes.webp
new file mode 100644
index 00000000000..ece9ebb56a7
Binary files /dev/null and b/tutorials/animation/img/manipulator_modes.webp differ
diff --git a/tutorials/animation/img/node_method_args.png b/tutorials/animation/img/node_method_args.png
deleted file mode 100644
index 071db033dbc..00000000000
Binary files a/tutorials/animation/img/node_method_args.png and /dev/null differ
diff --git a/tutorials/animation/img/node_method_args.webp b/tutorials/animation/img/node_method_args.webp
new file mode 100644
index 00000000000..2078e0013e9
Binary files /dev/null and b/tutorials/animation/img/node_method_args.webp differ
diff --git a/tutorials/animation/img/node_methods.png b/tutorials/animation/img/node_methods.png
deleted file mode 100644
index d7a8bb80fd7..00000000000
Binary files a/tutorials/animation/img/node_methods.png and /dev/null differ
diff --git a/tutorials/animation/img/node_methods.webp b/tutorials/animation/img/node_methods.webp
new file mode 100644
index 00000000000..038d02bc8fc
Binary files /dev/null and b/tutorials/animation/img/node_methods.webp differ
diff --git a/tutorials/animation/img/track_types.png b/tutorials/animation/img/track_types.png
deleted file mode 100644
index b42c072c3ae..00000000000
Binary files a/tutorials/animation/img/track_types.png and /dev/null differ
diff --git a/tutorials/animation/img/track_types.webp b/tutorials/animation/img/track_types.webp
new file mode 100644
index 00000000000..96fe1805d6d
Binary files /dev/null and b/tutorials/animation/img/track_types.webp differ
diff --git a/tutorials/animation/introduction.rst b/tutorials/animation/introduction.rst
index e35a2a3f6ce..07f0b53bb0b 100644
--- a/tutorials/animation/introduction.rst
+++ b/tutorials/animation/introduction.rst
@@ -27,7 +27,7 @@ The AnimationPlayer node type is the data container for your animations.
 One AnimationPlayer node can hold multiple animations, which can
 automatically transition to one another.
 
-.. figure:: img/animation_create_animationplayer.png
+.. figure:: img/animation_create_animationplayer.webp
    :alt: The AnimationPlayer node
 
    The AnimationPlayer node
@@ -35,14 +35,14 @@ automatically transition to one another.
 After you create an AnimationPlayer node, click on it to
 open the Animation Panel at the bottom of the viewport.
 
-.. figure:: img/animation_animation_panel.png
+.. figure:: img/animation_animation_panel.webp
    :alt: The animation panel position
 
    The animation panel position
 
 The animation panel consists of four parts:
 
-.. figure:: img/animation_animation_panel_overview.png
+.. figure:: img/animation_animation_panel_overview.webp
    :alt: The animation panel
 
    The animation panel
@@ -128,15 +128,35 @@ The sprite holds an image texture. For this tutorial, select the Sprite2D node,
 click Texture in the Inspector, and then click Load. Select the default Godot
 icon for the sprite's texture.
 
+Adding an animation
+~~~~~~~~~~~~~~~~~~~
+
 Select the AnimationPlayer node and click the "Animation" button in the
 animation editor. From the list, select "New" (|Add Animation|) to add a new
 animation. Enter a name for the animation in the dialog box.
 
-.. figure:: img/animation_create_new_animation.png
+.. figure:: img/animation_create_new_animation.webp
    :alt: Add a new animation
 
    Add a new animation
 
+Manage an animation libraries
+~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
+
+For reusability, the animation is registered in a list in the animation library resource. If you add an animation to AnimationPlayer without specifying any particular settings, the animation will be registered in the [Global] animation library that AnimationPlayer has by default.
+
+.. figure:: img/animation_library.webp
+   :alt: Manage animations
+
+   Manage animations
+
+If there are multiple animation libraries and you try to add an animation, a dialog box will appear with options.
+
+.. figure:: img/animation_library_dialog.webp
+   :alt: Add a new animation with library option
+
+   Add a new animation with library option
+
 Adding a track
 ~~~~~~~~~~~~~~
 
@@ -160,7 +180,7 @@ create it for us. Click **Create**.
 Godot will create a new track and insert our first keyframe at the beginning of
 the timeline:
 
-.. figure:: img/animation_track.png
+.. figure:: img/animation_track.webp
    :alt: The sprite track
 
    The sprite track
@@ -223,7 +243,7 @@ Track settings
 Each track has a settings panel at the end, where you can set its update
 mode, track interpolation, and loop mode.
 
-.. figure:: img/animation_track_settings.png
+.. figure:: img/animation_track_settings.webp
    :alt: Track settings
 
    Track settings
@@ -233,17 +253,13 @@ values. This can be:
 
 -  **Continuous:** Update the property on each frame
 -  **Discrete:** Only update the property on keyframes
--  **Trigger:** Only update the property on keyframes or triggers.
-   Triggers are a type of keyframe used by the
-   ``current_animation`` property of a :ref:`class_AnimationPlayer`,
-   and Animation Playback tracks.
 -  **Capture:** if the first keyframe's time is greater than ``0.0``, the
    current value of the property will be remembered and
    will be blended with the first animation key. For example, you
    could use the Capture mode to move a node that's located anywhere
    to a specific location.
 
-.. figure:: img/animation_track_rate.png
+.. figure:: img/animation_track_rate.webp
    :alt: Track mode
 
    Track mode
@@ -259,8 +275,10 @@ keyframes. These interpolation modes are supported:
    the two keyframes
 -  Cubic: Set the value based on a cubic function calculation between
    the two keyframes
+-  Linear Angle (Only appears in rotation property): Linear mode with shortest path rotation
+-  Cubic Angle (Only appears in rotation property): Cubic mode with shortest path rotation
 
-.. figure:: img/animation_track_interpolation.png
+.. figure:: img/animation_track_interpolation.webp
    :alt: Track interpolation
 
    Track interpolation
@@ -273,7 +291,7 @@ pace, resulting in a more robotic effect.
 Godot supports two loop modes, which affect the animation when it's set to
 loop:
 
-.. figure:: img/animation_track_loop_modes.png
+.. figure:: img/animation_track_loop_modes.webp
    :alt: Loop modes
 
    Loop modes
@@ -296,7 +314,7 @@ display a small keyframe button in the *Inspector* for each of the sprite's
 properties. Click on one of these buttons to add a track and keyframe to
 the current animation.
 
-.. figure:: img/animation_properties_keyframe.png
+.. figure:: img/animation_properties_keyframe.webp
    :alt: Keyframes for other properties
 
    Keyframes for other properties
@@ -307,7 +325,7 @@ Edit keyframes
 You can click on a keyframe in the animation timeline to display and
 edit its value in the *Inspector*.
 
-.. figure:: img/animation_keyframe_editor_key.png
+.. figure:: img/animation_keyframe_editor_key.webp
    :alt: Keyframe editor editing a key
 
    Keyframe editor editing a key
@@ -347,3 +365,5 @@ When adding tracks on new animations, the editor will ask you to automatically
 create a RESET track when using the keyframe icon next to a property in the inspector.
 This does not apply on tracks created with Godot versions prior to 3.4,
 as the animation reset track feature was added in 3.4.
+
+.. note:: RESET tracks is also used as a reference value for blending. See also `For better blending <../tutorials/animation/animation_tree.html#for-better-blending>`__.