Adjust color contrast by factor

Contrast around mid-gray is the classic imaging move that stretches or compresses each red, green, and blue channel away from the eight-bit midpoint one hundred twenty-eight, instead of sliding HSL lightness or raising a gamma power. Designers, token authors, and graphics engineers use a contrast factor when they want punchier or flatter swatches without spinning the hue wheel or treating the color as a full image. This tool accepts a CSS hex color and a finite factor in the closed interval from zero through ten, applies the per-channel rule that output equals mid-gray plus the signed distance from mid-gray times the factor, clamps every channel to the legal zero-to-two-hundred-fifty-five range, and returns the adjusted hex and RGB integers. A factor of one leaves the swatch unchanged; a factor of zero collapses every channel to mid-gray; values above one increase contrast and may clip highlights or shadows.

What contrast around mid-gray does to RGB channels

Start with a CSS hex color such as hash three three six six c c or the short form hash three six c. The parser expands three-digit codes, lowercases the digits, and converts each pair into red, green, and blue integers from zero to two hundred fifty-five. Mid-gray on that eight-bit scale is one hundred twenty-eight: the integer pivot used by classic contrast sliders in paint programs and raster pipelines.

Each channel is rewritten with ordinary arithmetic: subtract mid-gray, multiply by the contrast factor, add mid-gray again, then round to the nearest integer and clamp into the legal zero-to-two-hundred-fifty-five box. Channels already at mid-gray stay put for every finite factor, because their signed distance is zero. Channels darker than mid-gray move farther from it when the factor is greater than one and closer to it when the factor is between zero and one.

Channels brighter than mid-gray do the same in the opposite direction. A factor of exactly one is identity: every rounded channel matches the input. A factor of zero flattens the swatch to mid-gray on all three channels, which is the hex code eight zero eight zero eight zero.

The same factor is applied independently to red, green, and blue, so relative channel balance can change compared with an HSL contrast story that freezes hue. That difference is intentional: this contract is the linear mid-gray stretch, not a perceptual slider and not a WCAG pair ratio. Alpha hex forms with four or eight digits are rejected because the contract is opaque RGB only.

What you enter and what you get back

Send two fields: color as a hex string and factor as a finite number from zero through ten inclusive. Each swatch includes role, hex, integer r g b, and a printable rgb string. Top-level hex, r, g, and b mirror the contrast-adjusted result for one-line clients.

A short formula string documents the per-channel mid-gray rule for docs and support. Typical checks include applying factor one point five to a mid blue, applying factor zero point five to flatten a saturated red toward gray, confirming that factor one returns the original hex, confirming that factor zero yields mid-gray, and rejecting factor fifteen or a missing color. Wire the free browser form for quick previews, then call the identical contract from scripts when you need bulk token generation or continuous-integration checks.

Keep the factor inside the documented interval rather than relying on silent clamps of the multiplier itself — this tool fails loudly on a bad factor so design systems and rendering pipelines stay predictable across environments.

Where a mid-gray contrast factor earns its keep

Brand and product teams often keep a single hero hex and need a punchier or quieter companion without opening a full image editor or inventing a second brand color by eye. Design-token authors generate contrast ramps by sweeping a factor across a base swatch when HSL lighten or darken feels too pastel and gamma feels too display-specific. Presentation and marketing tools produce campaign variants from a saturated logo: raise the factor for a poster, lower it for a muted background chip.

Curriculum authors teaching imaging can show that stretching RGB around mid-gray is not the same as changing HSL lightness, not the same as a gamma power curve, and not the same as measuring WCAG contrast between two colors. If you later need to compare two hex codes for accessibility, apply a gamma exponent, lighten or darken in HSL, or filter a whole photograph, treat those as separate search intents and landings rather than overloading this mid-gray factor page.