Glassmorphism Generator — PHP source

<?php
/**
 * Pure glassmorphism CSS builder — deterministic, no DOM.
 *
 * Language: PHP
 * CosmoDev polyglot showcase port of the `glassmorphism-generator` tool.
 * Ported from src/lib/glassmorphism.ts — display source, part of CosmoDev's
 * polyglot tool pages.
 *
 * Builds a frosted-glass CSS block from blur / opacity / tint / radius /
 * borderOpacity (+ optional saturation). Hex tints (#rgb / #rrggbb) are
 * matched with preg_match; opacity is clamped to [0,1]; the alpha channel
 * is rounded with floor(x*100 + 0.5)/100 — JS Math.round (half-up)
 * semantics — and numbers are rendered like JS template literals
 * (10.0 -> "10", 0.3 -> "0.3") so the output matches the live TypeScript
 * lib byte-for-byte. Pure stdlib.
 */

/**
 * Render a number like a JS template literal (10.0 -> "10", 0.5 -> "0.5").
 */
function fmt_num($n) {
    $n = (float) $n;
    if ($n == (int) $n) {
        return (string) (int) $n;
    }
    // number_format recovers the shortest decimal (trailing zeros stripped).
    return rtrim(rtrim(number_format($n, 10, '.', ''), '0'), '.');
}

/**
 * Parse a #rgb or #rrggbb hex color into [r, g, b]; null if invalid.
 * A 3-char hex expands each digit (e.g. "abc" -> "aabbcc"), like CSS.
 * Exactly one leading '#' is stripped, matching the lib's /^#/ replace.
 */
function hex_to_rgb($hex) {
    $h = trim((string) ($hex ?? ''));
    if ($h !== '' && $h[0] === '#') {
        $h = substr($h, 1);
    }
    if (preg_match('/^[0-9a-f]{3}$/i', $h)) {
        return [hexdec($h[0] . $h[0]), hexdec($h[1] . $h[1]), hexdec($h[2] . $h[2])];
    }
    if (preg_match('/^[0-9a-f]{6}$/i', $h)) {
        return [hexdec(substr($h, 0, 2)), hexdec(substr($h, 2, 2)), hexdec(substr($h, 4, 2))];
    }
    return null;
}

/**
 * Clamp to [0,1], round with JS Math.round (half-up), and render the alpha.
 */
function alpha($a) {
    $c = max(0.0, min(1.0, (float) $a));
    $scaled = (int) floor($c * 100.0 + 0.5); // == Math.round(c * 100)
    return fmt_num($scaled / 100.0);
}

/**
 * Format an rgba() string, clamping + 2-decimal-rounding the alpha.
 */
function rgba($r, $g, $b, $a) {
    return 'rgba(' . round($r) . ', ' . round($g) . ', ' . round($b) . ', ' . alpha($a) . ')';
}

/**
 * Build the full glassmorphism CSS for a config array.
 * Keys: blur, opacity, tint, radius, borderOpacity, saturation (optional).
 */
function build_glassmorphism(array $config) {
    $blur = max(0.0, (float) ($config['blur'] ?? 0));
    $opacity = max(0.0, min(1.0, (float) ($config['opacity'] ?? 0)));
    $radius = max(0.0, (float) ($config['radius'] ?? 0));
    $borderOpacity = max(0.0, min(1.0, (float) ($config['borderOpacity'] ?? 0)));
    $saturation = $config['saturation'] ?? 180;
    $rgb = hex_to_rgb($config['tint'] ?? '');
    if ($rgb === null) {
        $rgb = [255, 255, 255];
    }

    $background = rgba($rgb[0], $rgb[1], $rgb[2], $opacity);
    $backdropFilter = 'blur(' . fmt_num($blur) . 'px) saturate(' . fmt_num($saturation) . '%)';
    $border = '1px solid ' . rgba(255, 255, 255, $borderOpacity);
    $borderRadius = fmt_num($radius) . 'px';
    $boxShadow = '0 8px 32px 0 rgba(31, 38, 135, 0.37)';

    $fullCss = implode("\n", [
        'background: ' . $background . ';',
        '-webkit-backdrop-filter: ' . $backdropFilter . ';',
        'backdrop-filter: ' . $backdropFilter . ';',
        'border-radius: ' . $borderRadius . ';',
        'border: ' . $border . ';',
        'box-shadow: ' . $boxShadow . ';',
    ]);

    return [
        'background' => $background,
        'backdropFilter' => $backdropFilter,
        'webkitBackdropFilter' => $backdropFilter,
        'border' => $border,
        'borderRadius' => $borderRadius,
        'boxShadow' => $boxShadow,
        'fullCss' => $fullCss,
    ];
}

// Demo
$css = build_glassmorphism([
    'blur' => 10,
    'opacity' => 0.3,
    'tint' => '#ffffff',
    'radius' => 12,
    'borderOpacity' => 0.2,
]);
echo $css['fullCss'] . "\n";