GeoJSON Map Previewer - Online Render on Interactive Map
Paste GeoJSON and instantly see it drawn on a draggable map. Supports points, lines, and polygons. Local fetch of tiles.
UD5 Toolkit
Observe, intercept, and customize object operations in real time.
console.log() to output to the log panel. The handler traps will be automatically recorded.
createObservable() helper. The playground highlights get, set, deleteProperty, has, ownKeys, and more. You can also define custom traps in the code editor.createObservable(target). It returns a proxy that logs every trap to the right panel. You can then perform operations like proxy.x = 10 and see the log update.set trap can validate values before they are assigned. For instance, you can throw an error or reject the update if the new value doesn't match a type or range. Check the "Validation" preset.console.log to capture output, and provides a few safe helper functions. Still, avoid pasting untrusted code. The tool is meant for learning and experimenting.Proxy.revocable() creates a proxy that can be disabled later. Once revoked, any operation on the proxy throws a TypeError. This is useful for secure resource isolation.Paste GeoJSON and instantly see it drawn on a draggable map. Supports points, lines, and polygons. Local fetch of tiles.
Define the initial scroll position for a scroll container with scroll‑start. Test with and without snapping. New feature.
Adjust root, margin, and threshold. See a live log of intersection events as you scroll. Debug lazy loading.
Paste a URL and extract all meta tags, Open Graph, Twitter Cards, and JSON‑LD. View in a friendly table. Client‑side fetch.
Draw shapes and experiment with globalCompositeOperation. See Porter‑Duff operators in action. Great for game devs.
Register and apply a custom paint worklet to draw a background pattern dynamically. Write the paint function in the browser.
Help the bird fly through pipes without touching them. Click or tap to flap. Track your high score in localStorage. Classic time‑waster.
Render the classic Stanford Bunny with a basic WebGPU pipeline. Rotate and zoom. Check if your browser supports WebGPU.
Add many complex CSS styles and measure frames per second. Isolate expensive properties. Practical performance lab.
A beautiful full‑screen drawing canvas with variable brush sizes, colors, and an eraser. Export your sketch as PNG. All data stays local.
Create a custom soap recipe by selecting oils and their percentages. Get precise lye and water amounts. Safety warnings included.
Write a paint worklet in JavaScript and see it used as a CSS background instantly. Experiment with Houdini. Local.
Move your mouse or finger to create colorful paint splatters on canvas. Great stress reliever. Download as PNG.
Divide pooled tips among staff based on hours worked or weighted percentages. Ensures fair distribution. Instant local calculation.
Create a simple tessellation by deforming a square or triangle and repeating it across the canvas. Hypnotic patterns.
Type JavaScript expressions and see output like a real browser console. Supports console.log, error, warn. Use for quick testing without DevTools.
Interactive cheatsheet for JavaScript regular expressions with live examples. Click any token to see its explanation and test it on sample text immediately.
Write a JavaScript snippet and get a ready‑to‑drag bookmarklet link. With minification and encoding. Easy browser tools.
Paste a URL or HTML to detect known vulnerable JavaScript library versions. Quick security audit. Client‑side only.
Animate text that looks like it's being decoded or scrambled before settling on the final word. Copy the JS snippet.
Drop a PDF and extract any embedded JavaScript or form actions. Check for malicious code. Privacy‑friendly analysis.
Paste JavaScript and catch syntax errors instantly with line numbers. Lightweight pre‑commit check. Local.
A textarea that expands in height as you type. See the implementation and copy the code. No library needed.
Create errors with the cause option and see chained error objects. Learn error wrapping for better debugging.
Explore all Intl APIs: NumberFormat, DateTimeFormat, RelativeTimeFormat, ListFormat. See outputs for any locale. Powerful i18n.
Create and dispatch custom events with detail. Listen on other elements. Understand pub/sub pattern in vanilla JS.
Watch a simulation of how the JavaScript event loop handles synchronous code, microtasks, and macrotasks. Learn async.
Create promises that resolve or reject after a delay. See state changes and chain .then/.catch. Debug async code.
Write a generator function and step through it with next(). See values and done state. Understand iterators.
Write JavaScript using element.animate() and see the result in a live preview. Compare with CSS keyframes. Debugger included.