In Appointment types let's add a small square with color next to hex code. after clicking on the small square dialog like below could be displayed, to facilitate choosing color.
Appointment types