diff --git a/docs/docs/Agents/agents-tools.mdx b/docs/docs/Agents/agents-tools.mdx
index d3c269ab2751..18ccec24446b 100644
--- a/docs/docs/Agents/agents-tools.mdx
+++ b/docs/docs/Agents/agents-tools.mdx
@@ -151,7 +151,7 @@ An agent can use [custom components](/components-custom-components) as tools.
3. Enable **Tool Mode** in the custom component.
4. Connect the custom component's tool output to the **Agent** component's **Tools** input.
-5. Open the **Playground** and instruct the agent, `Use the text analyzer on this text: "Agents really are thinking machines!"`
+5. Open the **Playground** and instruct the agent, `Use the text analyzer on this text: "Agents really are thinking machines!"`
Based on your instruction, the agent should call the `analyze_text` action and return the result.
For example:
diff --git a/docs/docs/Agents/agents.mdx b/docs/docs/Agents/agents.mdx
index 0bc1c9025312..ef6ebc4093ba 100644
--- a/docs/docs/Agents/agents.mdx
+++ b/docs/docs/Agents/agents.mdx
@@ -27,7 +27,7 @@ If your preferred model isn't listed, make sure it's enabled in the **Models** c
For more information, see [Agent component parameters](#agent-component-parameters).
5. Add [**Chat Input** and **Chat Output** components](/chat-input-and-output) to your flow, and then connect them to the **Agent** component.
- At this point, you have created a basic LLM-based chat flow that you can test in the **Playground**.
+ At this point, you have created a basic LLM-based chat flow that you can test in the **Playground**.
However, this flow only chats with the LLM.
To enhance this flow and make it truly agentic, add some tools, as explained in the next steps.
@@ -49,7 +49,7 @@ For more information, see [Agent component parameters](#agent-component-paramete

-8. Open the **Playground**, and then ask the agent, `What tools are you using to answer my questions?`
+8. Open the **Playground**, and then ask the agent, `What tools are you using to answer my questions?`
The agent should respond with a list of the connected tools.
It may also include built-in tools.
diff --git a/docs/docs/Components/bundles-docling.mdx b/docs/docs/Components/bundles-docling.mdx
index 67842e73f930..ecd10bd6c9bb 100644
--- a/docs/docs/Components/bundles-docling.mdx
+++ b/docs/docs/Components/bundles-docling.mdx
@@ -53,7 +53,7 @@ This example demonstrates how to use Docling components to split a PDF in a flow

5. Add a file to the **Docling** component.
-6. To run the flow, click **Playground**.
+6. To run the flow, click **Playground**.
The chunked document is loaded as vectors into your vector database.
diff --git a/docs/docs/Flows/concepts-overview.mdx b/docs/docs/Flows/concepts-overview.mdx
index 4de04ff6b1da..09c2c80fae77 100644
--- a/docs/docs/Flows/concepts-overview.mdx
+++ b/docs/docs/Flows/concepts-overview.mdx
@@ -48,7 +48,7 @@ Use these shortcuts, gestures, and functionality to navigate the workspace:
If your flow has a **Chat Input** component, you can use the **Playground** to run your flow, chat with your flow, view inputs and outputs, and modify the LLM's memories to tune the flow's responses in real time.
-To try this for yourself, create a flow based on the **Basic Prompting** template, and then click **Playground** when editing the flow in the workspace.
+To try this for yourself, create a flow based on the **Basic Prompting** template, and then click **Playground** when editing the flow in the workspace.

diff --git a/docs/docs/Flows/concepts-playground.mdx b/docs/docs/Flows/concepts-playground.mdx
index 6adf662077fd..76cd2d9eecb0 100644
--- a/docs/docs/Flows/concepts-playground.mdx
+++ b/docs/docs/Flows/concepts-playground.mdx
@@ -16,9 +16,13 @@ The **Playground** allows you to quickly iterate over your flow's logic and beha
## Run a flow in the Playground
-To run a flow in the **Playground**, open the flow, and then click **Playground**.
+To run a flow in the **Playground**, open the flow, and then click **Playground**.
Then, if your flow has a [**Chat Input** component](/chat-input-and-output), enter a prompt or [use voice mode](/concepts-voice-mode) to trigger the flow and start a chat session.
+To expand the **Playground** view, click **Fullscreen** within the **Playground** panel.
+
+
+
:::tip
If there is no message input field in the **Playground**, make sure your flow has a **Chat Input** component that is connected, directly or indirectly, to the **Input** port of a **Language Model** or **Agent** component.
diff --git a/docs/docs/Get-Started/get-started-quickstart.mdx b/docs/docs/Get-Started/get-started-quickstart.mdx
index 3bb974969372..b6f857f4b107 100644
--- a/docs/docs/Get-Started/get-started-quickstart.mdx
+++ b/docs/docs/Get-Started/get-started-quickstart.mdx
@@ -74,10 +74,9 @@ Many components can be tools for agents, including [Model Context Protocol (MCP)
* Edit Langflow's global **Models** configuration. These providers and models are part of Langflow's core functionality. Use the **Ollama** provider to connect to any model hosted on a local or remote Ollama instance.
* Use any [additional language model component](/components-models#additional-language-models), including your own custom components. In the **Agent** component, set the **Language Model** field to **Connect other models**, and then attach your preferred component.
+4. To run the flow, click **Playground**.
-4. To run the flow, click **Playground**.
-
5. To test the **Calculator** tool, ask the agent a simple math question, such as `I want to add 4 and 4.`
To help you test and evaluate your flows, the **Playground** shows the agent's reasoning process as it analyzes the prompt, selects a tool, and then uses the tool to generate a response.
In this case, a math question causes the agent to select the **Calculator** tool and use an action like `evaluate_expression`.
diff --git a/docs/docs/Support/release-notes.mdx b/docs/docs/Support/release-notes.mdx
index 8715285ce978..e5fbdd5dd285 100644
--- a/docs/docs/Support/release-notes.mdx
+++ b/docs/docs/Support/release-notes.mdx
@@ -96,9 +96,13 @@ For all changes, see the [Changelog](https://github.com/langflow-ai/langflow/rel
You can now use [global variables](/configuration-global-variables) in MCP server header values to securely store and reference sensitive values. For more information, see [Use global variables in MCP server headers](/mcp-client#use-global-variables-in-mcp-server-headers).
+- Playground moved
+
+ Moved the **Playground** to the right side of the visual builder for a more integrated testing experience. For the original full screen view, click **Fullscreen** within the **Playground** panel. For more information, see [Test flows in the Playground](/concepts-playground).
+
- More configuration options for JWT-based session authentication
- Langflow offers additional configuration options for JWT algorithms, including support for RS256/RS512 algorithms, configurable keys, and token lifetimes. For more information, see [JWT authentication](/jwt-authentication).
+ Langflow 1.8 offers additional configuration options for JWT algorithms, including support for RS256/RS512 algorithms, configurable keys, and token lifetimes. For more information, see [JWT authentication](/jwt-authentication).
## 1.7.x
diff --git a/docs/docs/Tutorials/agent.mdx b/docs/docs/Tutorials/agent.mdx
index 0cc5d0bd03de..7e2a91ca245c 100644
--- a/docs/docs/Tutorials/agent.mdx
+++ b/docs/docs/Tutorials/agent.mdx
@@ -39,7 +39,7 @@ When connected to an **Agent** component as tools, the agent has the option to u
If you want to use a different provider or model, edit the **Model Provider**, **Model Name**, and **API Key** fields accordingly.
-7. To test the flow, click **Playground**, and then ask the LLM a question, such as `Recommend 3 used items for carol.davis@example.com, based on previous orders.`
+7. To test the flow, click **Playground**, and then ask the LLM a question, such as `Recommend 3 used items for carol.davis@example.com, based on previous orders.`
Given the example prompt, the LLM would respond with recommendations and web links for items based on previous orders in `customer_orders.csv`.
diff --git a/docs/docs/Tutorials/chat-with-files.mdx b/docs/docs/Tutorials/chat-with-files.mdx
index 04faccc0525d..962768d7a221 100644
--- a/docs/docs/Tutorials/chat-with-files.mdx
+++ b/docs/docs/Tutorials/chat-with-files.mdx
@@ -30,7 +30,7 @@ The following steps modify the **Basic Prompting** template to accept file input
If you want to use a different provider or model, edit the **Model Provider**, **Model Name**, and **API Key** fields accordingly.
-3. To verify that your API key is valid, click **Playground**, and then ask the LLM a question.
+3. To verify that your API key is valid, click **Playground**, and then ask the LLM a question.
The LLM should respond according to the specifications in the **Prompt Template** component's **Template** field.
4. Exit the **Playground**, and then modify the **Prompt Template** component to accept file input in addition to chat input.
diff --git a/docs/docs/Tutorials/mcp-tutorial.mdx b/docs/docs/Tutorials/mcp-tutorial.mdx
index 600c321979aa..7e4afbfe02b7 100644
--- a/docs/docs/Tutorials/mcp-tutorial.mdx
+++ b/docs/docs/Tutorials/mcp-tutorial.mdx
@@ -40,7 +40,7 @@ This tutorial uses an OpenAI LLM. If you want to use a different provider, you n
If you want to use a different provider or model, edit the **Model Provider**, **Model Name**, and **API Key** fields accordingly.
-3. To test the flow, click **Playground**, and then ask the LLM `Is it safe to go hiking in the Adirondacks today?`
+3. To test the flow, click **Playground**, and then ask the LLM `Is it safe to go hiking in the Adirondacks today?`
This query demonstrates how an LLM, by itself, might not have access to information or functions designed to address specialized queries. In this example, the default OpenAI model provides a vague response, although the agent does know the current date by using its internal `get_current_date` function.
@@ -146,7 +146,7 @@ You need one **MCP Tools** component for each MCP server that you want your flow

-7. To test the weather MCP server, click **Playground**, and then ask the LLM `Is it safe to go hiking in the Adirondacks today?`
+7. To test the weather MCP server, click **Playground**, and then ask the LLM `Is it safe to go hiking in the Adirondacks today?`
The **Playground** shows you the agent's logic as it analyzes the request and select tools to use.
diff --git a/docs/static/img/agent-component.png b/docs/static/img/agent-component.png
index cc99d74a1bf1..b1360ec5e45f 100644
Binary files a/docs/static/img/agent-component.png and b/docs/static/img/agent-component.png differ
diff --git a/docs/static/img/agent-example-add-chat.png b/docs/static/img/agent-example-add-chat.png
index 5387fab24fc4..17c3605249e3 100644
Binary files a/docs/static/img/agent-example-add-chat.png and b/docs/static/img/agent-example-add-chat.png differ
diff --git a/docs/static/img/agent-example-add-tools.png b/docs/static/img/agent-example-add-tools.png
index a76ef843ae21..1af9913ada1c 100644
Binary files a/docs/static/img/agent-example-add-tools.png and b/docs/static/img/agent-example-add-tools.png differ
diff --git a/docs/static/img/agent-example-agent-as-tool.png b/docs/static/img/agent-example-agent-as-tool.png
index 34ba81319940..cf80a808ffcd 100644
Binary files a/docs/static/img/agent-example-agent-as-tool.png and b/docs/static/img/agent-example-agent-as-tool.png differ
diff --git a/docs/static/img/agent-example-run-flow-as-tool.png b/docs/static/img/agent-example-run-flow-as-tool.png
index 52b53be30017..2b32b07d012f 100644
Binary files a/docs/static/img/agent-example-run-flow-as-tool.png and b/docs/static/img/agent-example-run-flow-as-tool.png differ
diff --git a/docs/static/img/component-astra-db-json-tool.png b/docs/static/img/component-astra-db-json-tool.png
deleted file mode 100644
index 26c60280d69e..000000000000
Binary files a/docs/static/img/component-astra-db-json-tool.png and /dev/null differ
diff --git a/docs/static/img/component-chat-io.png b/docs/static/img/component-chat-io.png
index 52a7235070a6..66bd02321e8f 100644
Binary files a/docs/static/img/component-chat-io.png and b/docs/static/img/component-chat-io.png differ
diff --git a/docs/static/img/component-language-model.png b/docs/static/img/component-language-model.png
index aff124091ae7..99c57b5ffa17 100644
Binary files a/docs/static/img/component-language-model.png and b/docs/static/img/component-language-model.png differ
diff --git a/docs/static/img/connect-component.png b/docs/static/img/connect-component.png
index db19381e02cd..99c57b5ffa17 100644
Binary files a/docs/static/img/connect-component.png and b/docs/static/img/connect-component.png differ
diff --git a/docs/static/img/connect-data-components-to-agent.png b/docs/static/img/connect-data-components-to-agent.png
deleted file mode 100644
index ff9bb150fe52..000000000000
Binary files a/docs/static/img/connect-data-components-to-agent.png and /dev/null differ
diff --git a/docs/static/img/langflow-icon-black-transparent.svg b/docs/static/img/langflow-icon-black-transparent.svg
deleted file mode 100644
index 1c7b36c4dd67..000000000000
--- a/docs/static/img/langflow-icon-black-transparent.svg
+++ /dev/null
@@ -1,5 +0,0 @@
-
diff --git a/docs/static/img/langflow-logo-color-black-solid.svg b/docs/static/img/langflow-logo-color-black-solid.svg
deleted file mode 100644
index 2dae875821f9..000000000000
--- a/docs/static/img/langflow-logo-color-black-solid.svg
+++ /dev/null
@@ -1,21 +0,0 @@
-
diff --git a/docs/static/img/langflow-logo-color-blue-bg.svg b/docs/static/img/langflow-logo-color-blue-bg.svg
deleted file mode 100644
index ef967c6bdec7..000000000000
--- a/docs/static/img/langflow-logo-color-blue-bg.svg
+++ /dev/null
@@ -1,21 +0,0 @@
-
\ No newline at end of file
diff --git a/docs/static/img/playground-right-bar.png b/docs/static/img/playground-right-bar.png
new file mode 100644
index 000000000000..fa33f8ca6f8b
Binary files /dev/null and b/docs/static/img/playground-right-bar.png differ
diff --git a/docs/static/img/playground-with-agent.png b/docs/static/img/playground-with-agent.png
index 7382c4cdf212..786524a440b9 100644
Binary files a/docs/static/img/playground-with-agent.png and b/docs/static/img/playground-with-agent.png differ
diff --git a/docs/static/img/playground.png b/docs/static/img/playground.png
index 9d607ac5af3c..6b0a3f0ab747 100644
Binary files a/docs/static/img/playground.png and b/docs/static/img/playground.png differ
diff --git a/docs/static/img/prompt-component-with-multiple-inputs.png b/docs/static/img/prompt-component-with-multiple-inputs.png
index 29b47ae6d41a..80d61e1a7507 100644
Binary files a/docs/static/img/prompt-component-with-multiple-inputs.png and b/docs/static/img/prompt-component-with-multiple-inputs.png differ
diff --git a/docs/static/img/prompt-component.png b/docs/static/img/prompt-component.png
index 29b47ae6d41a..80d61e1a7507 100644
Binary files a/docs/static/img/prompt-component.png and b/docs/static/img/prompt-component.png differ
diff --git a/docs/static/img/quickstart-simple-agent-flow.png b/docs/static/img/quickstart-simple-agent-flow.png
index 2e5fc57006c5..448ed2732d90 100644
Binary files a/docs/static/img/quickstart-simple-agent-flow.png and b/docs/static/img/quickstart-simple-agent-flow.png differ
diff --git a/docs/static/img/quickstart-simple-agent-playground.png b/docs/static/img/quickstart-simple-agent-playground.png
index 74ae3a49af24..4e902e2240f9 100644
Binary files a/docs/static/img/quickstart-simple-agent-playground.png and b/docs/static/img/quickstart-simple-agent-playground.png differ
diff --git a/docs/static/img/select-output.png b/docs/static/img/select-output.png
index a2398f32ca67..b4c91900db37 100644
Binary files a/docs/static/img/select-output.png and b/docs/static/img/select-output.png differ
diff --git a/docs/static/img/vllm-logo-only-light.ico b/docs/static/img/vllm-logo-only-light.ico
deleted file mode 100644
index 27528ceebfff..000000000000
Binary files a/docs/static/img/vllm-logo-only-light.ico and /dev/null differ
diff --git a/docs/static/img/vllm-model-component.png b/docs/static/img/vllm-model-component.png
deleted file mode 100644
index f26f05bf60b3..000000000000
Binary files a/docs/static/img/vllm-model-component.png and /dev/null differ
diff --git a/docs/static/img/workspace-basic-prompting.png b/docs/static/img/workspace-basic-prompting.png
index d9b4325ada2d..ea6a11c8e7f8 100644
Binary files a/docs/static/img/workspace-basic-prompting.png and b/docs/static/img/workspace-basic-prompting.png differ
diff --git a/docs/static/img/workspace.png b/docs/static/img/workspace.png
index eab12987d1f2..44feadc4dc31 100644
Binary files a/docs/static/img/workspace.png and b/docs/static/img/workspace.png differ