Idiom #154 Halfway between two hex color codes

Find color c, the average between colors c1, c2.

c, c1, c2 are strings of hex color codes: 7 chars, beginning with a number sign # .
Assume linear computations, ignore gamma corrections.

c = "#" + (() => {
  const [p1, p2] = [c1, c2].map((color) => parseInt(color.slice(1), 16)),
    a = [];

  for (let i = 0; i <= 2; i += 1) {
    a.push(Math.floor(((p1 >> (i * 8) & 0xff) + (p2 >> (i * 8) & 0xff)) / 2));
  }

  return a.reverse().map((num) => num.toString(16).padStart(2, "0")).join("");
})();

var c = "#";
for(var i = 0; i<3; i++) {
  var sub1 = c1.substring(1+2*i, 3+2*i);
  var sub2 = c2.substring(1+2*i, 3+2*i);
  var v1 = parseInt(sub1, 16);
  var v2 = parseInt(sub2, 16);
  var v = Math.floor((v1 + v2) / 2);
  var sub = v.toString(16).toUpperCase();
  var padsub = ('0'+sub).slice(-2);
  c += padsub;
}

Demo

using System.Drawing;

Color color1 = ColorTranslator.FromHtml(c1);
Color color2 = ColorTranslator.FromHtml(c2);
c = string.Format($"#{((color1.R + color2.R) / 2):X2}{((color1.G + color2.G) / 2):X2}{((color1.B + color2.B) / 2):X2}");

import std.algorithm, std.range; 
import std.conv, std.array, std.format;

string c = roundRobin(c1.dropOne.chunks(2), c2.dropOne.chunks(2))
    .map!(a => a.to!int(16)).array
    .chunks(2)
    .map!(a => ((a[0] + a[1]) / 2))
    .fold!((a,b) => a ~= "%.2X".format(b))("#");

Demo

character (len=7) :: c, c1, c2
integer, dimension(3) :: v, v1, v2

read (unit=c1,fmt='(X,3Z2)') v1
read (unit=c2,fmt='(X,3Z2)') v2
v = (v1 + v2)/2
write (unit=c,fmt='("#",3Z2)') v

import "fmt"
import "strconv"

var buf [7]byte
buf[0] = '#'
for i := 0; i < 3; i++ {
	sub1 := c1[1+2*i : 3+2*i]
	sub2 := c2[1+2*i : 3+2*i]
	v1, _ := strconv.ParseInt(sub1, 16, 0)
	v2, _ := strconv.ParseInt(sub2, 16, 0)
	v := (v1 + v2) / 2
	sub := fmt.Sprintf("%02X", v)
	copy(buf[1+2*i:3+2*i], sub)
}
c := string(buf[:])

Demo

import "fmt"
import "strconv"

r1, _ := strconv.ParseInt(c1[1:3], 16, 0)
r2, _ := strconv.ParseInt(c2[1:3], 16, 0)
r := (r1 + r2) / 2

g1, _ := strconv.ParseInt(c1[3:5], 16, 0)
g2, _ := strconv.ParseInt(c2[3:5], 16, 0)
g := (g1 + g2) / 2

b1, _ := strconv.ParseInt(c1[5:7], 16, 0)
b2, _ := strconv.ParseInt(c2[5:7], 16, 0)
b := (b1 + b2) / 2

c := fmt.Sprintf("#%02X%02X%02X", r, g, b)

Demo
Doc

String r1 = c1.substring(1,3);
String g1 = c1.substring(3,5);
String b1 = c1.substring(5,7);

String r2 = c2.substring(1,3);
String g2 = c2.substring(3,5);
String b2 = c2.substring(5,7);

String r = String.format("%02X", (Integer.parseInt(r1, 16)+Integer.parseInt(r2, 16))/2 );
String g = String.format("%02X", (Integer.parseInt(g1, 16)+Integer.parseInt(g2, 16))/2 );
String b = String.format("%02X", (Integer.parseInt(b1, 16)+Integer.parseInt(b2, 16))/2 );

String c = "#" + r + g + b;

StringBuilder sb = new StringBuilder("#");
for(int i=0;i<3;i++) {
  String sub1 = c1.substring(1+2*i,3+2*i);
  String sub2 = c2.substring(1+2*i,3+2*i);
  int v1 = Integer.parseInt(sub1, 16);
  int v2 = Integer.parseInt(sub2, 16);
  int v = (v1 + v2)/2;
  String sub = String.format("%02X", v);
  sb.append(sub);
}
String c = sb.toString();

import static java.awt.Color.decode;
import java.awt.Color;

Color x = decode(c1), y = decode(c2);
int r = (x.getRed()   + y.getRed())   / 2,
    g = (x.getGreen() + y.getGreen()) / 2,
    b = (x.getBlue()  + y.getBlue())  / 2,
    z = (r << 16) + (g << 8) + b;
String c = "#%06x".formatted(z);

local c = "#"
for i=2,#c1,2 do
	local avg = (tonumber(c1:sub(i,i+1), 16) + tonumber(c2:sub(i,i+1), 16)) / 2
	c = c .. string.format("%02x", math.floor(avg))
end

SysUtils, Graphics

var
  c1, c2: string;
  RGB1, RGB2: LongInt;
  R1, G1, B1, R2, G2, B2: Byte;
  c: TColor;
begin
  RGB1 := ColorToRGB(StrToInt(StringReplace(c1,'#','$',[])));
  RGB1 := ColorToRGB(StrToInt(StringReplace(c2,'#','$',[])));
  RedGreenBlue(RGB1, R1, G1, B1);
  RedGreenBlue(RGB2, R2, G2, B2);
  c := RGBToColor(R1+R2 div 2, G1+G2 div 2, B1+B2 div 2);
end.

use List::SomeUtils qw(pairwise);

my @c1 = unpack 'xA2A2A2', $c1;
my @c2 = unpack 'xA2A2A2', $c2;
my $c = sprintf '#%02X%02X%02X', pairwise { (hex($a) + hex($b)) / 2 } @c1, @c2

import numpy

class RGB(numpy.ndarray):
  @classmethod
  def from_str(cls, rgbstr):
    return numpy.array([
      int(rgbstr[i:i+2], 16)
      for i in range(1, len(rgbstr), 2)
    ]).view(cls)
 
  def __str__(self):
    self = self.astype(numpy.uint8)
    return '#' + ''.join(format(n, 'x') for n in self)
 
c1 = RGB.from_str('#a1b1c1')
print(c1)
c2 = RGB.from_str('#1A1B1C')
print(c2)

print((c1 + c2) / 2)

r1, g1, b1 = [int(c1[p:p+2], 16) for p in range(1,6,2)]
r2, g2, b2 = [int(c2[p:p+2], 16) for p in range(1,6,2)]
c = '#{:02x}{:02x}{:02x}'.format((r1+r2) // 2, (g1+g2) //2, (b1+b2)// 2)

a = bytes.fromhex(c1[1:])
b = bytes.fromhex(c2[1:])
r, g, b = (sum(x) // 2 for x in zip(a, b))
c = (r << 16) + (g << 8) + b
c = f'{c:06x}'

rgbs = c1[1..-1].scan(/../), c2[1..-1].scan(/../)
c = "#%02X%02X%02X" % rgbs.transpose.map{|h1, h2| (h1.hex + h2.hex)/2 }

Demo

use std::str::FromStr;
use std::fmt;

"Too long for text box, see online demo"

Demo

Do you know the best way to do this in your language ? New implementation...

< > ⌨

Idiom created by programming-idioms.org

History

View revisions

Related idioms

Cheatsheets

Issues

Report a bug

Idiom #154 Halfway between two hex color codes

Please choose a nickname before doing this