diff --git a/src/lib/Playground/PlaygroundSyntax.svelte b/src/lib/Playground/PlaygroundSyntax.svelte
index e69de29b..8b0abbb2 100644
--- a/src/lib/Playground/PlaygroundSyntax.svelte
+++ b/src/lib/Playground/PlaygroundSyntax.svelte
@@ -0,0 +1,26 @@
+<script lang="ts">
+    import { Template } from '@huggingface/jinja';
+    import TextAreaInput from "../UI/GUI/TextAreaInput.svelte";
+  import { risuChatParser } from 'src/ts/parser';
+    let input = "";
+    let output = "";
+    const onInput = async () => {
+        try {
+            output = risuChatParser(input, {
+                consistantChar: true,
+            })
+        } catch (e) {
+            output = `Error: ${e}`
+        }
+    }
+</script>
+
+<h2 class="text-4xl text-textcolor my-6 font-black relative">Jinja</h2>
+
+<span class="text-textcolor text-lg">Input</span>
+
+<TextAreaInput onInput={onInput} bind:value={input} height="32" />
+
+<span class="text-textcolor text-lg">Result</span>
+
+<TextAreaInput value={output} height="32" />
\ No newline at end of file