diff --git a/src/components/sprite-info/sprite-info.css b/src/components/sprite-info/sprite-info.css
index 200aedaf79f13627abf74a4c9378ccb0f60eb300..f018abe8e604bc3652de5431731b18ed42110998 100644
--- a/src/components/sprite-info/sprite-info.css
+++ b/src/components/sprite-info/sprite-info.css
@@ -62,6 +62,11 @@
     border-bottom-left-radius: $form-radius;
 }
 
+.radio-left:focus {
+    border-color: #4c97ff;
+    box-shadow: inset 0 0 0 -2px rgba(0, 0, 0, 0.1);
+}
+
 .radio-right {
     border-bottom: 1px solid $form-border;
     border-top: 1px solid $form-border;
@@ -70,6 +75,11 @@
     border-bottom-right-radius: $form-radius;
 }
 
+.radio-right:focus {
+    border-color: #4c97ff;
+    box-shadow: inset 0 0 0 -2px rgba(0, 0, 0, 0.1);
+}
+
 .icon {
     width: 100%;
     height: 100%;
diff --git a/src/components/sprite-info/sprite-info.jsx b/src/components/sprite-info/sprite-info.jsx
index 5fcfd440f0f7b13b465a60adb21db1fdfdda5195..9e1c8a4098d2aeae08e55cf9aa1d95ccedb5bbd9 100644
--- a/src/components/sprite-info/sprite-info.jsx
+++ b/src/components/sprite-info/sprite-info.jsx
@@ -118,6 +118,7 @@ class SpriteInfo extends React.Component {
                                 )}
                                 tabIndex="4"
                                 onClick={this.props.onClickVisible}
+                                onKeyPress={this.props.onPressVisible}
                             >
                                 <img
                                     className={styles.icon}
@@ -134,8 +135,9 @@ class SpriteInfo extends React.Component {
                                         [styles.isDisabled]: this.props.disabled
                                     }
                                 )}
-                                tabIndex="4"
+                                tabIndex="5"
                                 onClick={this.props.onClickNotVisible}
+                                onKeyPress={this.props.onPressNotVisible}
                             >
                                 <img
                                     className={styles.icon}
@@ -153,7 +155,7 @@ class SpriteInfo extends React.Component {
                                 small
                                 disabled={this.props.disabled}
                                 label="Direction"
-                                tabIndex="5"
+                                tabIndex="6"
                                 type="text"
                                 value={this.props.disabled ? '' : this.props.direction}
                                 onSubmit={this.props.onChangeDirection}
@@ -202,6 +204,8 @@ SpriteInfo.propTypes = {
     onChangeY: PropTypes.func,
     onClickNotVisible: PropTypes.func,
     onClickVisible: PropTypes.func,
+    onPressNotVisible: PropTypes.func,
+    onPressVisible: PropTypes.func,
     rotationStyle: PropTypes.oneOf(ROTATION_STYLES),
     visible: PropTypes.bool,
     x: PropTypes.oneOfType([
diff --git a/src/containers/sprite-info.jsx b/src/containers/sprite-info.jsx
index 532fb37e5fdb8c9af94602ef825257b7bb1d64a9..f4b5ca696d2118898bdbd73c87b30173f8acf52d 100644
--- a/src/containers/sprite-info.jsx
+++ b/src/containers/sprite-info.jsx
@@ -10,7 +10,9 @@ class SpriteInfo extends React.Component {
         bindAll(this, [
             'handleChangeRotationStyle',
             'handleClickVisible',
-            'handleClickNotVisible'
+            'handleClickNotVisible',
+            'handlePressVisible',
+            'handlePressNotVisible'
         ]);
     }
     handleChangeRotationStyle (e) {
@@ -24,6 +26,18 @@ class SpriteInfo extends React.Component {
         e.preventDefault();
         this.props.onChangeVisibility(false);
     }
+    handlePressVisible (e) {
+        if (e.key === ' ' || e.key === 'Enter') {
+            e.preventDefault();
+            this.props.onChangeVisibility(true);
+        }
+    }
+    handlePressNotVisible (e) {
+        if (e.key === ' ' || e.key === 'Enter') {
+            e.preventDefault();
+            this.props.onChangeVisibility(false);
+        }
+    }
     render () {
         return (
             <SpriteInfoComponent
@@ -31,6 +45,8 @@ class SpriteInfo extends React.Component {
                 onChangeRotationStyle={this.handleChangeRotationStyle}
                 onClickNotVisible={this.handleClickNotVisible}
                 onClickVisible={this.handleClickVisible}
+                onPressNotVisible={this.handlePressNotVisible}
+                onPressVisible={this.handlePressVisible}
             />
         );
     }