UD5 Toolkit
Setlist Builder – Online Drag Songs into Order & Time
Drag songs into a setlist and see total duration. Perfect for planning a concert or DJ set.
Tag: Builder - Construct Patterns & Queries
22+ toolsWCAG Safe Palette Builder - Online Accessible Color Sets
Start with a base color and generate an extended palette where every shade contrasts properly with white and black. Export tokens.
One‑Page Resume Builder - Online Simple CV Generator
Fill in a form to generate a clean, ATS‑friendly one‑page resume. Customize sections, colors, and export as print‑ready PDF. Personal data stays in your browser.
CSS Subgrid Layout Builder - Online Align Nested Grids
Design a layout where nested grids share track sizes with their parent via subgrid. Copy the complete CSS.
Cocktail Builder - Online What Can I Make?
Select the ingredients you have at home and see a list of cocktails you can make. Surprise yourself. Local database.
Bookmarklet Code Builder - Online Convert JS to Bookmark
Write a JavaScript snippet and get a ready‑to‑drag bookmarklet link. With minification and encoding. Easy browser tools.
Scroll‑Driven Carousel Builder - Online CSS-Only Slider
Construct a CSS‑only carousel with scroll‑snap and scroll‑driven animations. Configurable gap, items, and progress indicator. Copy the HTML/CSS.
CSS Grid Layout Builder - Online Visual Drag & Drop
Add rows and columns, merge cells, and set gaps visually. Get the grid‑template CSS and HTML. Fast layout prototyping.
CSS Transition Playground - Online Visual Easing Curve Builder
Choose a property, duration, and bezier curve. Trigger the transition and see the animation. Copy the complete CSS rule.
Elevator Pitch Builder - Online Structured Intro
Craft a 30‑second elevator pitch by filling in problem, solution, and ask. Copy the final professional text.
Vanilla JS Plugin Builder - Online Template Generator
Get a clean, commented JS plugin skeleton with IIFE or ES module pattern. Start your new library faster.
GraphQL Query Builder - Online Visual Construct Request
Build a GraphQL query by selecting fields and nesting visually. Copy the built query string. For learning and fast prototyping.
Venn Diagram Builder - Online 2‑ & 3‑Set Overlap Visualizer
Create simple 2‑ or 3‑set Venn diagrams by entering comma‑separated lists. Shareable via URL fragment. No account.
Decision Tree Builder - Online Visual Yes/No Path
Build a simple decision tree by adding yes/no nodes. Flowchart style. Export as text outline.
Query String Parser & Builder - Online URL Params Editor
Parse a URL's query string into a key-value table, or build a query string from parameters. Perfect for API testing and web development.
Advanced CSS Gradient Builder - Online Multi‑Stop & Angle
Create complex linear gradients with any number of color stops, exact angles, and length units. Live preview and CSS code.
Atom Builder 2D - Online Create Elements with Protons/Electrons
Drag protons, neutrons, and electrons onto a Bohr model template. See the element change. Educational tool.
Yoga Sequence Builder - Online Drag & Drop Poses
Build a yoga flow by dragging pose cards into a sequence. Pose reference images included. Print or share your flow.
CSS Grid Playground - Online Interactive Layout Builder
Experiment with CSS Grid properties visually. Add rows, columns, and areas. See the grid in action and copy the code.
CSS‑Only Accordion Builder - Online No JavaScript FAQ
Configure and generate a pure CSS accordion with details/summary styling. Copy the HTML/CSS. Accessible and lightweight.
Crossword Builder - Online Create & Solve Simple Puzzles
Build a small crossword by adding words and clues. Export as a printable grid or solve in browser. Perfect for classrooms.
RegEx Tester - Online Regular Expression Builder & Matcher
Build and test regular expressions against sample text. Real-time match highlighting, capture groups display, and flavor options. All inside your browser.