diff --git a/assets/images/how_to_play/background.png b/assets/images/how_to_play/background.png
new file mode 100644
index 00000000..4bff902e
Binary files /dev/null and b/assets/images/how_to_play/background.png differ
diff --git a/assets/images/how_to_play/down_arrow.png b/assets/images/how_to_play/down_arrow.png
new file mode 100644
index 00000000..d6ac61e5
Binary files /dev/null and b/assets/images/how_to_play/down_arrow.png differ
diff --git a/assets/images/how_to_play/key_circle.png b/assets/images/how_to_play/key_circle.png
new file mode 100644
index 00000000..588c2b89
Binary files /dev/null and b/assets/images/how_to_play/key_circle.png differ
diff --git a/assets/images/how_to_play/left_arrow.png b/assets/images/how_to_play/left_arrow.png
new file mode 100644
index 00000000..50e798ee
Binary files /dev/null and b/assets/images/how_to_play/left_arrow.png differ
diff --git a/assets/images/how_to_play/space.png b/assets/images/how_to_play/space.png
new file mode 100644
index 00000000..9949b383
Binary files /dev/null and b/assets/images/how_to_play/space.png differ
diff --git a/lib/gen/assets.gen.dart b/lib/gen/assets.gen.dart
index 3e52e399..b4c312f0 100644
--- a/lib/gen/assets.gen.dart
+++ b/lib/gen/assets.gen.dart
@@ -14,6 +14,7 @@ class $AssetsImagesGen {
       const $AssetsImagesBonusAnimationGen();
   $AssetsImagesComponentsGen get components =>
       const $AssetsImagesComponentsGen();
+  $AssetsImagesHowToPlayGen get howToPlay => const $AssetsImagesHowToPlayGen();
 }
 
 class $AssetsImagesBonusAnimationGen {
@@ -48,6 +49,30 @@ class $AssetsImagesComponentsGen {
       const AssetGenImage('assets/images/components/background.png');
 }
 
+class $AssetsImagesHowToPlayGen {
+  const $AssetsImagesHowToPlayGen();
+
+  /// File path: assets/images/how_to_play/background.png
+  AssetGenImage get background =>
+      const AssetGenImage('assets/images/how_to_play/background.png');
+
+  /// File path: assets/images/how_to_play/down_arrow.png
+  AssetGenImage get downArrow =>
+      const AssetGenImage('assets/images/how_to_play/down_arrow.png');
+
+  /// File path: assets/images/how_to_play/key_circle.png
+  AssetGenImage get keyCircle =>
+      const AssetGenImage('assets/images/how_to_play/key_circle.png');
+
+  /// File path: assets/images/how_to_play/left_arrow.png
+  AssetGenImage get leftArrow =>
+      const AssetGenImage('assets/images/how_to_play/left_arrow.png');
+
+  /// File path: assets/images/how_to_play/space.png
+  AssetGenImage get space =>
+      const AssetGenImage('assets/images/how_to_play/space.png');
+}
+
 class Assets {
   Assets._();
 
diff --git a/pubspec.yaml b/pubspec.yaml
index f17ea07a..9235b508 100644
--- a/pubspec.yaml
+++ b/pubspec.yaml
@@ -48,6 +48,7 @@ flutter:
   assets:
     - assets/images/components/
     - assets/images/bonus_animation/
+    - assets/images/how_to_play/
 
 flutter_gen:
   line_length: 80