Image Lens Blur Effect - Online Fake Depth of Field
Apply a realistic lens blur (bokeh) to an image. Simulate shallow depth of field. Adjust aperture shape and intensity. Local canvas.
UD5 Toolkit
A 2D vector field assigns a vector (with an x-component and y-component) to every point in a two-dimensional plane. Mathematically, it's a function F(x,y) = (Fx(x,y), Fy(x,y)). Vector fields are fundamental in physics for describing phenomena like gravitational fields, electric fields, fluid flow, and magnetic fields.
Enter mathematical expressions for Fx and Fy using variables x and y. You can use functions like sin(x), cos(y), exp(x), sqrt(x^2+y^2), and constants like pi and e. Use ^ or ** for exponentiation. Adjust ranges, grid density, and arrow scaling using the controls. Click on the plot to add streamline seeds!
Streamlines (or flow lines) are curves that are everywhere tangent to the vector field. They represent the paths that massless particles would follow if released into the field. In fluid dynamics, they show flow patterns; in electromagnetism, they represent field lines. Streamlines help visualize the "flow" of the vector field.
The color of each arrow indicates the magnitude (strength) of the vector at that point. Blue represents smaller magnitudes, while red represents larger magnitudes. The color scale ranges from blue (weak) through cyan, green, and yellow to red (strong). This color-coding provides an immediate visual understanding of where the field is strongest.
Common examples include: Gradient fields (conservative forces like gravity), Rotational fields (magnetic fields around currents), Source/Sink fields (electric fields from charges), Uniform fields (constant gravitational field near Earth's surface), and Dipole fields (electric or magnetic dipoles). Try the presets to explore these!
By default, arrow lengths are proportional to the vector magnitude at each point, with automatic scaling so the largest arrow fits within the grid cell. You can adjust the scaling factor manually using the Arrow Scale slider, or toggle "Uniform Arrow Length" to show all arrows at the same length (showing only direction, with color still encoding magnitude).
Variables: x, y |
Constants: pi, e |
Functions: sin(x), cos(x), tan(x), exp(x), log(x), ln(x), sqrt(x), abs(x), atan(x), atan2(y,x), asin(x), acos(x), sinh(x), cosh(x), tanh(x), pow(x,n) |
Operators: +, -, *, /, ^ or ** (power) |
Examples: sin(x)*cos(y), x^2-y^2, exp(-(x^2+y^2))
Apply a realistic lens blur (bokeh) to an image. Simulate shallow depth of field. Adjust aperture shape and intensity. Local canvas.
Upload two portraits and create a simple morph animation between them. Download as GIF. Local canvas magic.
Type any CSS selector with :hover/:active/:focus and see the styles applied live. Perfect for debugging interaction states.
Create a zoom lens effect for product images. Move the cursor to magnify. Copy the HTML/CSS/JS code.
Design a button or card that glows on hover. Adjust shadow color, spread, and transition. Copy the CSS. Rich UI.
Enter task names, start dates, and durations to generate a simple Gantt chart as an image. Quick project view.
Choose a property, duration, and bezier curve. Trigger the transition and see the animation. Copy the complete CSS rule.
Add recurring bills with amounts and see a monthly calendar with due date indicators. Simple finance organizer.
Create a glowing or rotating border animation around an element. Copy the CSS keyframes. Pure CSS magic.
Plan insulin or other injection sites with a visual body map and date log. Prevent lipohypertrophy.
Track daily mood with emoji selection and optional notes. See weekly/monthly mood trends in a color-coded chart. All data stored privately in localStorage.
Apply an emboss filter to your photo. Choose direction and depth. Gives a 3D carved stone look. Pure canvas.
Get a random, lighthearted daily horoscope based on your zodiac sign. For entertainment only. No personal data collected.
The original arcade Pong recreated in HTML5. Play against AI or local two‑player. Score up to 11 and win. Pure retro fun.
Build a valid SPF TXT record by selecting mail servers, IPv4/IPv6 ranges, and includes. Validate syntax and get ready‑to‑publish output.
Set start date and egg type (chicken, duck, quail) to generate a hatching timeline with milestone alerts (lockdown, pip, hatch). Local only.
Explore the new two‑value display syntax like `display: block flex`. See what each inner/outer pair does visually.
Type any condition and see the result of the ternary operator. Understand truthy/falsy values. Quick learning tool.
Get a humorous, randomly generated daily horoscope for any zodiac sign. Not real astrology; purely for laughs.
Reference for how long common supplements stay in the body. Inform taking frequency.
Create the iPhone Dynamic Island look‑alike with a pill that expands on hover. Pure CSS. Copy the playful code.
Select an emoji that matches your mood and log it to a simple calendar. Self‑awareness tool. Local only.
Turn your message into a scenic mountain emoji art panel. Choose different landscapes. Copy and paste anywhere.
Issue and redeem Private State Tokens (formerly Trust Tokens). Understand how they help detect bots without cookies.
Use the abs() and sign() CSS functions to create interesting layouts. See computed values live. Cutting‑edge CSS.
Preview the Gravatar image associated with any email address. Generate the correct Gravatar URL. Handy for avatar debugging.
A festive, full‑screen countdown showing the exact days, hours, and minutes until December 25th. Snow effect.
Write and store encrypted daily journal entries directly in your browser's localStorage. Export as TXT. No sign-up, fully private.
Select a state and year to see all public holidays. Works offline with built-in data. Plan your long weekends. Simple reference tool.
Generate a hash showing how trackers can fingerprint your browser (canvas, WebGL, fonts). Educational and privacy‑aware.