diff --git a/web/modals/threads/color-selector-button.react.js b/web/modals/threads/color-selector-button.react.js
index 9492ba29a..e0869ab8f 100644
--- a/web/modals/threads/color-selector-button.react.js
+++ b/web/modals/threads/color-selector-button.react.js
@@ -1,39 +1,40 @@
 // @flow
 
 import classNames from 'classnames';
 import * as React from 'react';
+import tinycolor from 'tinycolor2';
 
 import css from './color-selector-button.css';
 
 type ColorSelectorButtonProps = {
   +color: string,
   +currentColor: string,
   +onColorSelection: (hex: string) => void,
 };
 function ColorSelectorButton(props: ColorSelectorButtonProps): React.Node {
   const { color, currentColor, onColorSelection } = props;
 
-  const active = color.toLowerCase() === currentColor.toLowerCase();
+  const active = tinycolor.equals(color, currentColor);
   const containerClassName = classNames(css.container, {
     [css.active]: active,
   });
 
   const colorSplotchStyle = React.useMemo(
     () => ({
       backgroundColor: `#${color}`,
     }),
     [color],
   );
 
   const onColorSplotchClicked = React.useCallback(() => {
     onColorSelection(color);
   }, [onColorSelection, color]);
 
   return (
     <div onClick={onColorSplotchClicked} className={containerClassName}>
       <div className={css.colorSplotch} style={colorSplotchStyle} />
     </div>
   );
 }
 
 export default ColorSelectorButton;