WebGL Fluid Simulation - Online Interactive Ink Drop
Move your mouse to create colorful ink swirls in a simulated fluid. Beautiful and mesmerizing. No install. Just WebGL.
UD5 Toolkit
Simulate real paint mixing. Explore subtractive and additive color blending, preview gradients, and get HEX, RGB, CMYK values instantly.
Move your mouse to create colorful ink swirls in a simulated fluid. Beautiful and mesmerizing. No install. Just WebGL.
Simulate how a palette looks under daylight, tungsten, or fluorescent light. Understand metamerism. For accurate color work.
Rotate the hue of any image globally. Turn a red car blue instantly. Download the result. Works entirely in the browser.
Keep one selected color and turn the rest of the image to grayscale. Eye‑catching selective color effect. Pure canvas.
See how `animation‑composition: replace, add, accumulate` works by layering animations on the same property. Understand the spec.
Apply real-time CSS filters or canvas effects to a video and download the processed output. Experiment with video post-processing locally.
Visualize Brownian motion with hundreds of particles. Adjust temperature and viscosity to see diffusion changes. Educational science tool.
Create beautiful, syntax-highlighted screenshots of your code snippets. Choose themes and export as PNG. All client-side canvas rendering.
Select a color in an image and completely remove it or make it transparent. Great for background removal experiments. Local.
Apply a realistic oil painting texture to your photo. Adjust brush size and roughness. Brush stroke simulation.
Apply a blur effect to image background while keeping the subject sharp. Simple brush selection for area to keep sharp. CSS+Canvas implementation, local only.
Render 1000 styled elements using inline styles vs. CSS classes and compare time. Understand CSS‑in‑JS trade‑offs.
Automatically remove white background from an image and make it transparent. Adjust tolerance. Save as PNG.
Recreate the target CSS linear gradient by adjusting stops and colors. A unique game for front‑end developers to master gradients.
Chain multiple CSS filter functions and see the result on an image. Copy the filter string. No upload.
Search for common ingredient substitutions (e.g., buttermilk, egg, cornstarch). Quick reference for when you're missing something. Local data.
Generate a subtle noise/grain texture as a CSS background pattern. Adjust opacity and size. For that film look.
Generate a subtle or heavy noise/grain texture as a CSS background. Adjust intensity and color. Copy the small code.
Create a looping animated gradient background with multiple color stops. Copy the complete CSS keyframes. Eye‑catching.
Control a lunar module and try to land softly on the moon. Manage fuel and thrust. Classic arcade physics. Canvas.
Generate truly random numbers within a specified range. Useful for contests, game decisions, and sampling. Runs locally, no hidden algorithms.
Fill in a component name and generate a complete Stencil.js component with TSX, CSS, and test files. Quick start.
Generate dynamic placeholder images by specifying width, height, colors, and text. View instantly as a URL you can embed in mockups. Canvas-based.
Get a random dessert recipe with ingredients and steps. From cakes to cookies. Solve your sweet cravings. Local database.
Select text and see the Selection object properties. Create ranges programmatically. Understand how rich‑text editors work.
Enter a CSS selector and see its specificity broken down into A,B,C columns with a visual weight comparison. Learn specificity.
Preview different touch feedback patterns (scale, color, ripple) for mobile buttons. Copy the CSS and HTML. Improve mobile UX.
Add a soft vignette to your photo. Control radius, darkness, and feathering. Creates a classic photographic look.
Adjust a brightness threshold slider and see the live vector trace of an image. Export as SVG. Potrace‑style.
Create and format Markdown tables by adjusting rows and columns. Align text, copy the raw Markdown. Perfect for README files.