UD5 Toolkit
Flexbox Froggy Simulator - Online Learn CSS Flexbox Game
A replica of the famous Flexbox Froggy game: solve alignment puzzles by writing CSS. Progress saved locally. Fun frontend learning.
Paper Snowflake Simulator - Online Fold & Cut Preview
Paper Snowflake Simulator
Fold, cut & preview your snowflake design in real time
Folded Wedge Editor
45° wedge · 8-point
Unfolded Snowflake Preview
8-point symmetry
Frequently Asked Questions
How does this paper snowflake simulator work?
Our simulator mimics the real paper snowflake folding process. The left panel shows the folded wedge — the triangular piece of paper after folding. You "cut" by drawing dark marks on this wedge. The right panel instantly unfolds your design using rotational symmetry, showing the full snowflake. Choose 6-point symmetry for realistic snowflake shapes (real snowflakes have 6-fold symmetry).
What does the number of points / symmetry mean?
The symmetry number determines how many identical sections your snowflake has. A 6-point snowflake has a 60° wedge (the folded triangle covers 1/6 of the circle). An 8-point snowflake uses a 45° wedge. In real paper folding: folding a square 3 times creates 8 layers (8-point), while special folding techniques can achieve 6 or 12 points.
How do I create better snowflake designs?
Focus on the curved edge (the arc farthest from the center point) — cuts here shape the outer silhouette of your snowflake. Cuts along the straight edges create internal patterns. Try our presets for inspiration! Start with simple cuts and gradually add detail. Remember that every mark you make will be mirrored symmetrically.
Can I save or print my snowflake design?
Yes! Click the PNG download button to save your snowflake as a high-resolution image (500×500px). You can then print it, share it online, or use it for craft projects. The exported image has a dark background with a white snowflake, perfect for display.
What's the difference between 6-point and 8-point snowflakes?
6-point snowflakes (60° wedge) most closely resemble natural snow crystals, which nearly always exhibit hexagonal (6-fold) symmetry due to the molecular structure of ice. 8-point snowflakes (45° wedge) are easier to fold in real life (3 simple folds of a square) and produce beautiful mandala-like patterns. Both are popular for paper crafts!
Why does my snowflake look different from what I drew?
The wedge editor shows only one slice of the final snowflake. When unfolded, that single slice is rotated and mirrored around the center. Cuts near the wedge tip become intricate patterns near the snowflake center, while cuts along the outer arc define the snowflake's edge shape. The real-time preview helps you see the results instantly!
Word Scrambler - Online Letter Jumble Game Generator
Scramble letters of any word or sentence to create anagrams. Great for brain teasers and vocabulary games. Simple, fun, and client-side.
Word Scramble Solver & Game - Online Unjumble Letters
Unscramble jumbled letters to form words. Timed challenge mode with hints. Compares against built-in dictionary. Improve vocabulary while having fun.
Random Name Picker - Online Wheel for Raffles & Giveaways
Enter a list of names and spin a wheel to pick a random winner. Remove picked names to avoid duplicates. Perfect for classrooms or contests.
Word Scramble Solver - Online Unjumble & Anagrams
Stuck in a word scramble game? Enter the scrambled letters and get a list of possible English words. Built‑in dictionary. All local.
Weather Stripping Selector – Online Gap Size to Material Guide
Match gap size around doors/windows to the correct type of weather stripping (foam, V-strip, door sweep). Save energy.
React Testing Library Skeleton - Online Test Boilerplate
Enter a component name and generate a complete RTL test file with render, screen, and common assertions. Fast testing setup.
Responsive Design Tester - Online Viewport Emulator
Preview any website inside emulated device viewports (iPhone, iPad, various resolutions). No screenshot, live interaction in an iframe. Local tool.
Responsive Breakpoint Tester - Online Drag Viewport Width
Enter a URL and drag a slider to change the viewport width smoothly. See exactly where your layout breaks. No iframe limits.
Native Accordion Generator - Online HTML & Summary
Create a pure HTML/CSS accordion using <details> elements. Add custom styling and get the clean code. No JavaScript required.
Random Color Generator - Online Hex & RGB Palette
Generate single random colors or full palettes. Displays hex, RGB, and copy on click. Great for design inspiration.
Grid vs Flexbox Layout Tester - Online Choose the Right Tool
Build the same layout with both Grid and Flexbox side by side. See the code differences and visual results.
Running Splits Calculator - Online Race Pace Predictor
Enter a recent race time and predict times for other distances. Also get lap splits for different intervals.
CSS color‑mix() Function Playground - Online Tester
Dynamically blend two colors using the CSS color‑mix() function in different color spaces. Copy the exact CSS snippet. No JS required.
Image to CMYK Color Separation - Online Print Preview
Upload an image and see the cyan, magenta, yellow, and black plates as separate grayscale images. Pre‑press tool.
Custom Range Slider CSS Generator - Online Styled Input
Style an `<input type='range'>` with custom track and thumb. Cross‑browser CSS. Preview and copy the code.
Stepped Color Shade Generator - Online Tailwind‑Style Palette
Pick a base color and generate a full palette of 10 shades (50 to 900) like Tailwind CSS. Copy as hex or hsl.
HSV Color Picker - Online Traditional Hue Wheel
Classic HSV color wheel with sliders. See hex, RGB, and HSL equivalents. Intuitive for artists. No server interaction.
CSS Grid Implicit Tracks Tester - Online Auto‑Rows & Columns
Add grid items beyond defined tracks and see how implicit rows/columns expand. Set sizes interactively. Master the grid.
color() Display‑P3 Generator - Online Wide Gamut CSS
Pick a color in the Display‑P3 space and get the CSS color() function. See the difference from sRGB. For modern design.
Caesar Cipher Encoder & Decoder - Online Shift Cipher Tool
Encrypt and decrypt messages using the classic Caesar cipher with configurable shift key. Fun for puzzles and basic cryptography lessons. Entirely browser-based.
Color Trend Inspector - Online Pick Year & See Palette
See the Pantone Colors of the Year and popular palettes from past years. Get hex codes. Design inspiration.
HDR Color Preview - Online See Wide Gamut Colors
Test if your display supports HDR colors by rendering a gradient in Rec.2020 space. See what you're missing. Canvas based.
HTML Color Input Explorer - Online Native Picker & Events
Use <input type='color'> and see its change events and value in hex. Understand the native color picker. Quick demo.
HTML Color Names - Online Complete List with Hex & Preview
A complete, searchable list of all 140+ named HTML/CSS colors with their hex codes and color previews. Click to copy code. Essential web reference.
accent‑color Tester - Online Form Control Styling
Set a custom accent color for checkboxes, radios, range, and progress. See the browser’s rendering. Copy the CSS.
light‑dark() Function Tester - Online Color Switch
Use the light‑dark() CSS function to change colors based on color scheme. Build a simple dark mode toggle with one property.
Accessible Color Contrast Grid - Online Test Combinations
Enter a palette of colors and see a grid showing whether each foreground/background pair passes AA or AAA contrast. Must for designers.
contrast‑color() Preview - Online Automatic Text Color
Test the upcoming contrast‑color() CSS function. Get white or black automatically for a given background. See it live.
RGB to CMYK Converter - Online Print Color Translator
Convert screen RGB colors to print-ready CMYK values. Understand color shifts before printing. Ideal for graphic designers preparing artwork for press.