Help us understand the problem. What is going on with this article?

色コードの明暗を判定する

課題

例えば、「#4631b9」のような色のコード。
この色は、比較的「暗い色」なのか?「明るい色」なのか?

使う場面

背景色を「#4631b9」にした場合、文字は「白」が良いか?「黒」が良いか?

背景色を動的に変える場合、自動で判定したい。

公式

( $r*0.299 + $g*0.587 + $b*0.114 ) / 2.55

明るい場合には100に近い値、暗い場合には0に近い値となる。

PHPコード

getLuminance.php
<?php

function getLuminance( $rgb ) {

    $r = hexdec( mb_substr( $rgb, 0, 2 ) ); 
    $g = hexdec( mb_substr( $rgb, 2, 2 ) );     
    $b = hexdec( mb_substr( $rgb, 4, 2 ) ); 

    return ( $r*299 + $g*587 + $b*114 ) / 2550;

}

echo getLuminance( "4631b9" );


真っ白#ffffffなら100、真っ黒#000000なら0が返る。

入力値が「4631b9」場合、約28の値が返る。つまり、#4631b9は比較的暗い色だから「文字には明るい白」が良い。

参考URL

https://fromkato.com/color/4631b9 ← #4631b9 は、この色

Why not register and get more from Qiita?
  1. We will deliver articles that match you
    By following users and tags, you can catch up information on technical fields that you are interested in as a whole
  2. you can read useful information later efficiently
    By "stocking" the articles you like, you can search right away
Comments
No comments
Sign up for free and join this conversation.
If you already have a Qiita account
Why do not you register as a user and use Qiita more conveniently?
You need to log in to use this function. Qiita can be used more conveniently after logging in.
You seem to be reading articles frequently this month. Qiita can be used more conveniently after logging in.
  1. We will deliver articles that match you
    By following users and tags, you can catch up information on technical fields that you are interested in as a whole
  2. you can read useful information later efficiently
    By "stocking" the articles you like, you can search right away
ユーザーは見つかりませんでした