diff --git a/packages/self-service/playground/index.html b/packages/self-service/playground/index.html
index a0bec89a8..dcd049129 100644
--- a/packages/self-service/playground/index.html
+++ b/packages/self-service/playground/index.html
@@ -93,7 +93,7 @@
     <!-- Initialize chat-ai-widget and render the widget component -->
     <script type="text/babel">
       const isMobile = /iPhone|iPad|iPod|Android/i.test(navigator.userAgent);
-      const { ChatWindow } = window.ChatAiWidget;
+      const { ChatWindow, widgetServiceName } = window.ChatAiWidget;
       function getHost(region) {
         if (region && region.startsWith('no')) {
           return { apiHost: `https://api-${region}.sendbirdtest.com`, wsHost: `wss://ws-${region}.sendbirdtest.com` };
@@ -127,6 +127,7 @@
             deviceType={mode}
             apiHost={apiHost}
             wsHost={wsHost}
+            serviceName={widgetServiceName.playground}
             callbacks={{
               onWidgetSettingFailure() {
                 window.document.getElementById('root').classList.add('hide');
diff --git a/src/const.ts b/src/const.ts
index 91db229d7..25fb04dc8 100644
--- a/src/const.ts
+++ b/src/const.ts
@@ -350,6 +350,7 @@ export const elementIds = {
 
 export const widgetServiceName = {
   default: 'genai-chatbot-widget',
+  playground: 'genai-widget-playground',
   self: {
     default: 'genai-self-service',
     wordpress: 'genai-wordpress-self-service',