Interactive Sliders — Recipe Scaler Variant

What it does

• Drag-to-scale slider — learners pull a single slider to set servings, batch size, or headcount
• Auto-updating quantity list — every line in the list scales instantly with the input
• Smart-rounded amounts — values display with sensible precision (whole numbers, fractions, or rounded decimals)
• Unit-aware display — quantities keep their units (cups, grams, units) without breaking the layout
• Reset and preset buttons — return to default size or jump to common batch sizes

Best use cases

• Cooking and baking — recipe scaling, batch baking, fermentation ratios
• Event planning — guest-count-driven supply lists, catering quantities
• Crafting and DIY — kit scaling for different project sizes
• Manufacturing and trades — material take-offs that scale to project size
• Brewing and beverage — homebrew batch scaling, cocktail party quantities

What you can change with your DNA

When you run this through the remix skill, your CCOS DNA — brand, voice, audience — drives these decisions automatically:

• Colors — slots for background, slider track, slider handle, list background, and quantity emphasis.
• Fonts — two roles: a friendly display font for the title and a clean monospaced or tabular font for quantities.
• Copy — title, slider label, list of items with base quantities and units, and any tips or notes.
• Images — optional small icon next to each list item (ingredient, part, person) to add visual anchor.
• Behavior — set base size, min/max scale, step size, and rounding rules per item.