Invertir o cambiar a blanco y negro el color HTML del texto según el background o color de fondo en PHP

Dado un color de fondo, invertir el color del texto. Dado un color de fondo, texto en blanco o negro.
07/03/2021 693 personas han visto este post 693 Todo sobre PHP

Hay veces que tenemos colores dinámicos de fondo y queremos que el color del texto se invierta para que este sea legible.

Lo vamos a conseguir con dos funciones en php (Ni que decir tiene que estas funciones son válidas para cambiar o invertir tanto en el color del texto, como el color de fondo):

 

Dado un color de fondo, invertir el color del texto.

Funcion php para invertir el color del texto, dado un color de fondo, pasando un valor hexadecimal.

function color_inverse($color){
    $color = str_replace('#', '', $color);
    if (strlen($color) != 6){ return '000000'; }
    $rgb = '';
    for ($x=0;$x<3;$x++){
        $c = 255 - hexdec(substr($color,(2*$x),2));
        $c = ($c < 0) ? 0 : dechex($c);
        $rgb .= (strlen($c) < 2) ? '0'.$c : $c;
    }
    return '#'.$rgb;
}
// Azul -> Amarillo
echo color_inverse('#0000FF');
// --> #FFFF00

 

Dado un color de fondo, poner texto en blanco o negro.

Funcion php para cambiar el color del texto en blanco o negro, dado un color de fondo, pasando un valor hexadecimal.

function getContrastColor($hexColor) 
{

        // hexColor RGB
        $R1 = hexdec(substr($hexColor, 1, 2));
        $G1 = hexdec(substr($hexColor, 3, 2));
        $B1 = hexdec(substr($hexColor, 5, 2));

        // Negro RGB
        $blackColor = "#000000";
        $R2BlackColor = hexdec(substr($blackColor, 1, 2));
        $G2BlackColor = hexdec(substr($blackColor, 3, 2));
        $B2BlackColor = hexdec(substr($blackColor, 5, 2));

         // Calculo de relación de contraste
         $L1 = 0.2126 * pow($R1 / 255, 2.2) +
               0.7152 * pow($G1 / 255, 2.2) +
               0.0722 * pow($B1 / 255, 2.2);

        $L2 = 0.2126 * pow($R2BlackColor / 255, 2.2) +
              0.7152 * pow($G2BlackColor / 255, 2.2) +
              0.0722 * pow($B2BlackColor / 255, 2.2);

        $contrastRatio = 0;
        if ($L1 > $L2) {
            $contrastRatio = (int)(($L1 + 0.05) / ($L2 + 0.05));
        } else {
            $contrastRatio = (int)(($L2 + 0.05) / ($L1 + 0.05));
        }

        //Si el contraste es superior a 5, devuelve el color negro.
        if ($contrastRatio > 5) {
            return '#000000';
        } else { 
            // Si no, devuelve el color blanco..
            return '#FFFFFF';
        }
}

// Retorna '#FFFFFF'
echo getContrastColor('#FF0000');

 

Tags
Daniela B. Escrito por:
Daniela B.
Déjanos tu comentario
Valora el Post

Comentarios

Sea el primero en opinar Sea el primero en opinar sobre "Invertir o cambiar a blanco y negro el color HTML del texto según el background o color de fondo en PHP".
Aviso legal: Las opiniones de los usuarios son independientes y reflejan las experiencias personales de cada uno de ellos.