Digging things up…
Digging things up…
Common UI pattern reference — navigation, forms, cards, modals, tables, infinite scroll and more.
Modal / Dialog
Overlays that require user interaction before returning to main content. Use for confirmations, forms, and alerts.
Use when
Destructive actions, required decisions, focused data entry
Avoid when
Non-critical information — use toast/snackbar instead
Focus trap inside modal. Escape closes. aria-modal, aria-labelledby. Return focus on close.
<dialog role="dialog" aria-modal="true" aria-labelledby="title"> <h2 id="title">Confirm deletion</h2> <p>This cannot be undone.</p> <button>Cancel</button> <button>Delete</button> </dialog>
Developer Tools
Encoders, formatters, validators and generators that run entirely in your browser. Whatever you paste stays on your machine — nothing is sent to a server.
Related developer tools
Encode text to Base64 or decode Base64 back to text. Supports URL-safe encoding and Unicode. Runs entirely in your browser — nothing is sent to any server.
Use tool →{ }Format, validate, and minify JSON with clear error messages. Choose 2-space, 4-space, or tab indentation. Client-side only — your data never leaves the browser.
Use tool →🔑Create cryptographically secure passwords with full control over length and character sets.
Use tool →🔗Encode special characters in URLs or decode percent-encoded strings — instantly in your browser.
Use tool →Explore more from Dino Media: All Free Tools · Our Services · Digital Glossary · Our Work
Web Development
From custom web apps to complex integrations, our development team builds fast, robust websites that scale with your business.