API Playground

API Playground
API Playground

About API Playground

A mock API console for your landing page or docs. Visitors pick an endpoint, read the request in cURL, JavaScript, Python or Go, press Run and watch the response come back with a status and latency. Nothing is called for real: you type in your endpoints and what they return.

What you get

  • Your endpoints. Name, method, path, request body, response, status and latency per endpoint. Four samples show until you add your own.

  • Four languages from one source. cURL, JavaScript, Python and Go are generated from the endpoint, so they never drift. Pick which tabs to show, their order and the one it opens on.

  • Real responses, including the bad ones. 2xx green, 4xx and 5xx red, with the status text: 201 Created, 404 Not Found, 429 Too Many Requests. A 204 shows no content, as it should.

  • Run that feels live. A sending state, latency with a little jitter on every run, response lines streaming in. Auto run sends the first request as the visitor scrolls in.

  • Copy button. Puts the current snippet on the clipboard.

  • Fits anywhere. Follows its own width: under 620px the endpoint list becomes a row of pills, so it works in a sidebar as well as a hero.

  • Your look. Dark or light, window, card or bare frame, accent colour, radius, code font and UI font. Syntax colours come with the theme.

  • Keyboard and screen readers. Real tabs with arrow keys, real buttons, visible focus rings.

  • Canvas preview. Show the response on the canvas while you design, without pressing anything.

No plugins, no API keys, no backend. Works on every Framer plan.

Demo

https://apiplayground.framer.website