bgcolor

When I design a web page that requires a background color for a table cell, I want a very light color for the background so that it does not hurt the eyes. But I can not find the correct RGB (Red, Green, Blue) combination for a very light color. Frontpage does not help much as the background colors it provides is quite limited. So I decided to write a php program that will generate an html file to display all RGB combinations possible.

At first, I wrote a php program to directly generate all RGB combinations and then realized that the data is quite big. To display all combinations of the RGB, there should be: 256*256*256 = 16,777,216 combinations! I displayed the combinations 8 per line, so 16,777.216 / 8 = 2,097,152 lines. When I pointed the browser to this php program, my computer got really sluggish. I had to abort the operation as it might crash my computer.

With the data so, this is practically unuseable! To make it useable, I had to create multiple html files based on Red value: R=0 create bgcolor0.html, R=255 create bgcolor255.html, etc. This means that the total html files created is 256 files. Each file would contain 256*256 = 65,536 combinations. Display 8 combinations per line (65,536 / 8 = 8,192), i.e., each html file contains 8,192 lines. Still too large, but doesn't affect the computer's performance.

When I look at the result, I realized that when the value of the RGB is low, .e.g., #000000, the color is black (saturated), while when the value if high, e.g., #FFFFFF, the color is white (light). Since I want a very light color, I decided to only create combinations from 255 to 128. This reduced the size and number of files created:

Number of files created: 128 files
Content of html file: 128*128*128 = 16,384 combinations, 16,384 / 8 per line = 2,048 lines

Still a little too big. I reasoned that the colors of neighboring combinations might be hardly noticeable, so I decided to display only 1 for every 4 combinations. This reduced more the size and number of files created:

Number of files created: 32 files
Content of html file: 32*32*32 = 32,768 combinations, 32,768 / 8 per line = 4,096 lines

I hope that you find this useful as a reference.

Fr. Visminlu Vicente L. Chua, S.J.
2013/03/07

當我設計一個網頁而需要表格之儲存格的背景顏色時,我要的是一種很淡而不刺眼的顏色。但平常我找不到 RGB (紅綠藍) 剛剛好的組合來產生我要的淡顏色。Frontpage 在這方面也幫不了忙因為所提供的顏色很有限。因此我決定寫一個 php 程式來 產生一個 html 檔案來顯示所有 RGB 可能的組合。

首先,我撰寫了一個 php 程式直接產生所有 RGB 的組合。然而我發現所產生的資料非常的大。要顯示所有 RGB 組合應該有 256*256*256 = 16,777,216 個組合。每列顯示 8 個組合,所以 16,777,216/8 = 2,097,152 列。當我把瀏覽器連接到到這 php 程式,我的電腦的反應變很遲鈍。我不得不中止怕我的電腦會當機。

資料這樣大等於無法使用!要使它可以使用我必須建多個 html 檔案。檔案名稱是基於紅色的值:當 R=0 時,建 bgcolor0.html,R=255 時,建 bgcolor255.html,等。算一算總共我必須建 256 個檔案。每一個檔案包含 256*256 = 65,536 個組合。每一列顯示 8 個組合 (65,536/8 = 8,192)。意思是說,每一個 html 檔案包含 8,192 列。還是很大,但是已不影響電腦的性能。

我查看結果時,我發現當 RGB 的值是低時,例如 #000000,顏色是黑 (濃)。但是當直是高時,例如 #FFFFFF,顏色是百 (淡)。但我想要的是淡的顏色,我就決定只建 255 至 128 的組合。這樣的就減少了檔檔案的大小和檔案的數目:

建立的檔案數目:128 個檔案
html 檔案的內容:128*128*128 = 16,384 個組合,每列 8 個組合,16,384/8 = 2,048列

還是有一點大。我想一想感覺相鄰的組合可能是難以察覺的顏色,所以我決定每四個組合只顯示一個。這樣更減少了檔案大小和建立檔案的數目:

建立檔案數目:32 個檔案
html 檔案的內容:32*32*32 = 32,768 個組合,每列 8 個組合,16,384/8 = 2,048列

希望這是可用的參考資料。

蔡由世神父
2013/03/07


#FFFFFF - #FF8383 #FBFFFF - #FB8383 #F7FFFF - #F78383 #F3FFFF - #F38383 #EFFFFF - #EF8383 #EBFFFF - #EB8383 #E7FFFF - #E78383 #E3FFFF - #E38383
#DFFFFF - #DF8383 #DBFFFF - #DB8383 #D7FFFF - #D78383 #D3FFFF - #D38383 #CFFFFF - #CF8383 #CBFFFF - #CB8383 #C7FFFF - #C78383 #C3FFFF - #C38383
#BFFFFF - #BF8383 #BBFFFF - #BB8383 #B7FFFF - #B78383 #B3FFFF - #B38383 #AFFFFF - #AF8383 #ABFFFF - #AB8383 #A7FFFF - #A78383 #A3FFFF - #A38383
#9FFFFF - #9F8383 #9BFFFF - #9B8383 #97FFFF - #978383 #93FFFF - #938383 #8FFFFF - #8F8383 #8BFFFF - #8B8383 #87FFFF - #878383 #83FFFF - #838383

To those interested, the php program that I wrote: 有興趣的,我所撰寫的 php 程式:
<?php

// Write to html files all possible RGB background color combinations in the range 255 - 128.
// Each html file contains 16,384 combinations (128*128 = 16,384), each line contains 8 combinations.
// So each html file contain 16,384 / 8 = 2048 lines.
// Fr. Visminlu Vicente L. Chua, S.J.
// 2013/03/04

$page = 1;
for ($i = 255; $i >= 128; $i = $i - 4) {
  $filename = "bgcolor$page.html";
  if (! $handle = fopen("$filename", "w")) {
     echo "Cannot open file $filename.html";
     exit;
  }
   fwrite($handle, "<html>\n<head>\n</head>\n<body><p align=\"center\"><b>");
   $hex = "#" . strtoupper(dechex($i));
  $start = $hex . "FFFF";
  $end = $hex . "8383";
   fwrite($handle, "$start - $end</b></p>");
   fwrite($handle, "<table border=\"1\" width=\"100%\">\n");

   for ($j = 255; $j >= 128; $j = $j - 4) {
       $cells = 0;
     for ($k = 255; $k >= 128; $k = $k - 4) {
        if ($cells == 0) fwrite($handle, "<tr>\n");
        if ($i < 16) $hex3 = "#0" . strtoupper(dechex($i));
        else $hex3 = "#" . strtoupper(dechex($i));
        if ($j < 16) $hex2 = "0" . strtoupper(dechex($j));
        else $hex2 = strtoupper(dechex($j));
        if ($k < 16) $hex1 = "0" . strtoupper(dechex($k));
        else $hex1 = strtoupper(dechex($k));
        $data = "<td bgcolor=\"" . $hex3 . $hex2 . $hex1 . "\"><p align=\"center\">" . $hex3 . $hex2 . $hex1 . "</p></td>";
        fwrite($handle, $data);
           if ($cells == 7) {
           fwrite($handle, "</tr>\n");
           $cells = 0;
        }
        else $cells += 1;
     }
  }
  fwrite($handle, "</tables>\n<table border=\"0\" width=\"100%\">\n<tr>\n");
  $prev = $page - 1;
  if ($page == 1) $previous = "<td>&nbsp;</td>";
  else $previous = "<td><p align=\"left\"><a href=\"bgcolor" . $prev . ".html\">&lt;&lt;&lt; previous</a></td>";
  fwrite($handle, $previous);
  $nxt = $page + 1;
  if ($page == 32) $next = "<td>&nbsp;</td>";
  else $next = "<td><p align=\"right\"><a href=\"bgcolor" . $nxt . ".html\">next &gt;&gt;&gt;</a></td>";
  fwrite($handle, $next);
  fwrite($handle, "</tr>\n</table>\n</body>\n</html>\n");
  fclose($handle);
  $page += 1;
}
?>