KAGEXには既読テキストと未読テキストで色を変える機能がありません。少しtjsで書き換えるだけで簡単に実現できます。

書き換えるのはMessageLayer.tjsの2476行目です。drawTextToLayerでテキストを描画していますが、chColorが色の設定です。ルビがある場合は2497行目でまたdrawTextToLayerを使って描画しています。この2箇所を適当に書き換えればいいです。

		drawTextToLayer(ll, dx, dy, ch, chColor);

		if(currentRuby != "")
		{
			// ルビがある
			var cw = llfont.getTextWidth(ch);
			var orgsize = llfont.height;
			llfont.height = rubySize;
			var rw = llfont.getTextWidth(currentRuby);
			var rx,ry;
			if(!vert)
			{
				rx = int(dx + (cw>>1) - (rw>>1));
				ry = int(dy - rubySize - rubyOffset);
			}
			else
			{
				rx = int(dx + rubySize + rubyOffset);
				ry = int(dy + (cw>>1) - (rw>>1));
			}

			drawTextToLayer(ll, rx, ry, currentRuby, chColor);

			llfont.height = orgsize;
			currentRuby = '';
		}

既読かどうかはkag.getCurrentRead()でわかります。現在のテキストが既読ならtrue、未読ならfalseになります。以下では既読なら色を0xFF0000、未読ならchColorそのままになるように変更しました。

		if (kag.getCurrentRead()) {
			drawTextToLayer(ll, dx, dy, ch, 0xFF0000);
		} else {
			drawTextToLayer(ll, dx, dy, ch, chColor);
		}

		if(currentRuby != "")
		{
			// ルビがある
			var cw = llfont.getTextWidth(ch);
			var orgsize = llfont.height;
			llfont.height = rubySize;
			var rw = llfont.getTextWidth(currentRuby);
			var rx,ry;
			if(!vert)
			{
				rx = int(dx + (cw>>1) - (rw>>1));
				ry = int(dy - rubySize - rubyOffset);
			}
			else
			{
				rx = int(dx + rubySize + rubyOffset);
				ry = int(dy + (cw>>1) - (rw>>1));
			}

			if (kag.getCurrentRead()) {
				drawTextToLayer(ll, dx, dy, ch, 0xFF0000);
			} else {
				drawTextToLayer(ll, dx, dy, ch, chColor);
			}

			llfont.height = orgsize;
			currentRuby = '';
		}