diff --git a/src/components/ui/TimeControlButton/index.js b/src/components/ui/TimeControlButton/index.js
index 31a66d6..56c3940 100644
--- a/src/components/ui/TimeControlButton/index.js
+++ b/src/components/ui/TimeControlButton/index.js
@@ -4,16 +4,22 @@ import * as U from 'karet.util';
 import * as R from 'kefir.ramda';
 
 import * as T from './index.d';
+
+import Button from 'components/ui/Button';
 /**
  *
  * @param {T.Props} props
  */
 function TimeControlButton({ count, children }) {
   return (
-    <button onClick={U.doModify(count, R.dec)} disabled={R.equals(count, 0)}>
+    <Button
+      group
+      action={U.doModify(count, R.dec)}
+      disabled={R.equals(count, 0)}
+    >
       {children}
       {U.when(count, U.string`(${count})`)}
-    </button>
+    </Button>
   );
 }