diff --git a/2025/WebComponentsLearning/TodoItem.js b/2025/WebComponentsLearning/TodoItem.js
index 9dc1b64..d7bee31 100644
--- a/2025/WebComponentsLearning/TodoItem.js
+++ b/2025/WebComponentsLearning/TodoItem.js
@@ -1,8 +1,8 @@
 class TodoItem extends HTMLElement {
   constructor() {
     super();
-    this.innerHTML = `Hi I am custom ${this.innerText}!`;
+    this.innerHTML = `Hi I am custom <h3>${this.innerText}</h3>!`;
   }
 }
 
-customElements.define("todo-item", TodoItem);
\ No newline at end of file
+customElements.define("todo-item", TodoItem);
diff --git a/2025/WebComponentsLearning/index.html b/2025/WebComponentsLearning/index.html
index c91407b..eff30e9 100644
--- a/2025/WebComponentsLearning/index.html
+++ b/2025/WebComponentsLearning/index.html
@@ -5,8 +5,15 @@
   <meta name="viewport" content="width=device-width, initial-scale=1.0">
   <title>Document</title>
   <script defer src="./TodoItem.js"></script>
+  <script src="https://cdn.tailwindcss.com"></script>
+  <style>
+    h3 {
+      color: red;
+    }
+  </style>
 </head>
 <body>
+  <h3>other</h3>
   <todo-item>hello</todo-item>
 </body>
 </html>
\ No newline at end of file
diff --git a/2025/WebComponentsLearning/tailwind.config.js b/2025/WebComponentsLearning/tailwind.config.js
new file mode 100644
index 0000000..e69de29
