diff --git a/public/ui/backButton_small.png b/public/ui/backButton_small.png
new file mode 100644
index 00000000..44849068
Binary files /dev/null and b/public/ui/backButton_small.png differ
diff --git a/public/ui/nextButton_small.png b/public/ui/nextButton_small.png
new file mode 100644
index 00000000..8b93b8d1
Binary files /dev/null and b/public/ui/nextButton_small.png differ
diff --git a/src/components/TraitInformation.jsx b/src/components/TraitInformation.jsx
index e8f2c220..f6fdc0d3 100644
--- a/src/components/TraitInformation.jsx
+++ b/src/components/TraitInformation.jsx
@@ -120,15 +120,16 @@ export default function TraitInformation({currentVRM, animationManager}){
-
+ >
{animationName}
-
+ >
diff --git a/src/components/TraitInformation.module.css b/src/components/TraitInformation.module.css
index cddd36d0..9e1eed72 100644
--- a/src/components/TraitInformation.module.css
+++ b/src/components/TraitInformation.module.css
@@ -65,3 +65,37 @@
height:40px;
align-items: center;
}
+
+.anim-button {
+
+ cursor: pointer;
+ overflow: hidden;
+ opacity: 0.8;
+ width: 32px;
+ height: 32px;
+ margin: 2px;
+ text-align: center;
+ outline-color: #3b434f;
+ outline-width: 2px;
+ outline-style: solid;
+ align-items: center;
+ margin-bottom: 30px;
+ background-color: #1e2530;
+}
+.left-button{
+ background: url('/ui/backButton_small.png');
+ background-position: center;
+ background-repeat: no-repeat;
+ background-size: cover;
+}
+
+.right-button{
+ background: url('/ui/nextButton_small.png');
+ background-position: center;
+ background-repeat: no-repeat;
+ background-size: cover;
+}
+
+.anim-button:hover {
+ opacity: 1;
+}
\ No newline at end of file