Library
Curated, copy-paste presets and examples: CSS gradients and more, free and open to everyone.
CSS gradient presets24A curated set of ready-to-use CSS gradients. Click a swatch to copy the `background` value, or open the gradient tool to fine-tune the angle and colors.
Color palette presets16Curated 5-color palettes, ready to copy as hex codes. Each one shows the contrast ratio between its lightest and darkest color, so you know at a glance whether it can carry readable text.
Cron schedule recipes23Copy-ready cron expressions for the schedules people actually run: five-minute polls, weekday mornings, nightly batches, month-end closes. Click a card to copy the standard 5-field expression, or paste it into the cron tool for a plain-language explanation and the next run times. The strip on each card marks when the job fires along a day, week, month, or year.
Regex validation patterns16Sixteen regex patterns for the validation and text cleanup you reach for again and again: email, URL, phone, password strength, IDs, dates, and a couple of find-and-replace helpers. Click a card to copy the bare pattern, no slashes or flags, then paste it into the regex tool's Pattern field to test it against real text. Most patterns here are anchored (^...$) for whole-string validation; the tag-stripping and whitespace ones are unanchored so they find every match inside a longer text.
CSS easing curves22Copy-ready cubic-bezier easing curves for CSS transitions and animations: the classic sine, quad, cubic, quart and expo families plus back curves with a slight overshoot. Each swatch draws the actual curve, progress runs left to right, value bottom to top. Click a card to copy the timing-function value.
SVG background patterns12Seamless SVG background patterns as single copy-paste CSS background values: dots, stripes, grids, waves, and more. The tile is inlined as a data URI, so there is no extra request and nothing to host. Click a card to copy, then swap the two hex colors in the value to match your palette.
Content-Security-Policy recipes11Copy-ready Content-Security-Policy header values for the setups people actually run: a strict starter, Google Fonts, analytics, YouTube embeds, nonce-based scripts, clickjacking protection. Click a card to copy the policy, then set it as the Content-Security-Policy header (each recipe notes what it allows). The strip on each card shows one block per directive, amber blocks contain an unsafe-* source worth revisiting.
