Developer Playground

The NexGate Developer Playground at dashboard.nexgate.app/playground is a full-featured AI testing workspace. Build prompts, tune parameters, compare models, and copy production-ready code without leaving the browser.

Workspace layout

The playground uses a three-panel layout:

On desktop you can drag the dividers between panels to resize them. On mobile the workspace switches to a tabbed view: Prompt / Chat / Parameters.

Model picker

Click the model button in the right panel to open the full model picker:

• Search by model ID, provider, category, or use case
• Models are grouped by provider (OpenAI, DeepSeek, xAI, Moonshot AI, Meta…)
• Each card shows the speed badge, input and output price per million tokens, and a one-line use-case hint
• Selecting a model automatically adjusts which parameter controls are shown (e.g. temperature is locked for fixed-sampling models, web search only appears for models that support it)

Developer Message (system prompt)

Template variables

Insert {{variable_name}} placeholders in any message or system prompt:

Summarize this article about {{topic}} in {{format}} format.

As soon as you type double braces, NexGate parses your text and renders an input field for each variable in the left panel. Values are substituted automatically before each request.

Running completions

Type a message in the input bar at the bottom of the chat panel. Press Enter to send, Shift+Enter for a newline.

• Run — send the message and receive a completion
• Stop — abort a streaming response mid-generation
• Regenerate — discard the last assistant reply and re-run the last user message
• Clear — wipe the conversation history

The input bar shows a live token estimate and estimated cost for the current conversation as you type.

Authentication and billing

The playground is keyless. Completions are authenticated with your signed-in session and charged directly to your account's prepaid credit balance — you never create or paste an API key to use it.

• The header shows your current credit balance and the cost of each completed run.
• If your available balance cannot cover a request, the playground shows an insufficient-credits message and does not send the request upstream.
• To test an ng- API key itself, call the chat completions endpoint directly.

Markdown rendering

Assistant responses are rendered with full Markdown support:

• Fenced code blocks with monospace formatting
• Inline code spans
• Headers, bold, italic, unordered lists

Hover over any message to reveal a Copy button.

Parameters

All parameters in the right panel are model-aware. Controls that are not supported by the selected model are hidden automatically.

Multimodal attachments

For models that support image inputs (e.g. gpt-4o, gpt-5.5):

1. Click the Paperclip icon in the input bar.
2. Select a .png, .jpg, .jpeg, or .webp file.
3. The image is converted to a base64 data URL and attached to the next user message.

The attachment icon is hidden automatically for models that do not support image inputs.

Compare mode

Use the Compare section in the right panel to run your current conversation through a second model and see both responses side by side:

1. Select a second model from the dropdown.
2. Click Run Compare.
3. The second model's response appears in the chat inline, labelled with the model name.

Presets

Save your current prompt configuration and message history as a named preset (stored in your browser's local storage):

• Click the Save icon in the chat header to save a preset.
• Load presets via the Preset dropdown.
• Download your full session as JSON using the Download icon.
• Copy the full transcript using the Copy icon.

Live integration code exporter

Click Code in the chat header to open a modal with copyable code snippets matching your exact settings:

from openai import OpenAI

client = OpenAI(
    api_key="ng-your-key-here",
    base_url="https://api.nexgate.app/v1"
)

response = client.chat.completions.create(
    model="gpt-5.5",
    messages=[
        {"role": "developer", "content": "You are a helpful assistant."},
        {"role": "user", "content": "Hello!"}
    ],
    temperature=0.7,
    max_completion_tokens=2048,
    stream=True
)

for chunk in response:
    print(chunk.choices[0].delta.content or "", end="")

import OpenAI from 'openai';

const client = new OpenAI({
  apiKey: 'ng-your-key-here',
  baseURL: 'https://api.nexgate.app/v1'
});

const response = await client.chat.completions.create({
  model: 'gpt-5.5',
  messages: [
    { role: 'developer', content: 'You are a helpful assistant.' },
    { role: 'user', content: 'Hello!' }
  ],
  temperature: 0.7,
  max_completion_tokens: 2048,
  stream: true
});

for await (const chunk of response) {
  process.stdout.write(chunk.choices[0]?.delta?.content || '');
}

curl https://api.nexgate.app/v1/chat/completions \
  -H "Authorization: Bearer ng-your-key-here" \
  -H "Content-Type: application/json" \
  -d '{
    "model": "gpt-5.5",
    "messages": [
      {"role": "developer", "content": "You are a helpful assistant."},
      {"role": "user", "content": "Hello!"}
    ],
    "temperature": 0.7,
    "max_completion_tokens": 2048,
    "stream": true
  }'