diff --git a/UI/JsAnimationStyle/README.md b/UI/JsAnimationStyle/README.md
new file mode 100644
index 0000000000000000000000000000000000000000..2c475cf69288af83bcf71be3601508841d17e3f3
--- /dev/null
+++ b/UI/JsAnimationStyle/README.md
@@ -0,0 +1,24 @@
+# JS Animation and Custom Font Styles<a name="EN-US_TOPIC_0000001126346896"></a>
+
+### Introduction<a name="section104mcpsimp"></a>
+
+This sample shows how to use animation styles, gradient styles, transition styles, and custom font styles in JavaScript.
+
+1. Animation styles: translate, rotate, scale, and combined
+
+2. Gradient styles: linear-gradient and repeating-linear-gradient
+
+3. Transition styles: shared-element, custom, and card
+
+4. Custom font styles: implemented by referencing the .otf font file \(The same rule applies to the TTF font.\)
+
+### Usage<a name="section111mcpsimp"></a>
+
+In this sample, there are four buttons on the home screen of your app.
+
+You can touch any of these buttons to access the corresponding style page and view how a style looks. For example, you can touch the Move button on the animation style page to see how a component moves with the defined settings.
+
+### Constraints<a name="section115mcpsimp"></a>
+
+This sample can only be run on mini-system devices.
+