diff --git a/web/client/components/misc/GridCard.jsx b/web/client/components/misc/GridCard.jsx
index 685f184304..294efbf08b 100644
--- a/web/client/components/misc/GridCard.jsx
+++ b/web/client/components/misc/GridCard.jsx
@@ -47,7 +47,11 @@ class GridCard extends React.Component {
         return (<div
             style={this.props.style}
             className={"gridcard" + (this.props.className ? " " + this.props.className : "")}
-            onClick={this.props.onClick}>
+            onClick={this.props.onClick}
+            role={this.props.onClick ? "link" : ""}
+            tabIndex={0}
+            onKeyDown={(e) => e.key === 'Enter' ? this.props.onClick(e) : null}
+        >
             {!isNil(this.props.header) ? <div style={this.props.titleStyle} className="gridcard-title bg-primary">{this.props.header}</div> : null}
             {this.props.children}
             {this.renderActions()}
diff --git a/web/client/components/misc/__tests__/GridCard-test.jsx b/web/client/components/misc/__tests__/GridCard-test.jsx
index f5c18a1755..00e4183cc7 100644
--- a/web/client/components/misc/__tests__/GridCard-test.jsx
+++ b/web/client/components/misc/__tests__/GridCard-test.jsx
@@ -61,4 +61,13 @@ describe('This test for GridCard', () => {
         );
         expect(button).toExist();
     });
+
+    it('enter triggers onClick event', (done) => {
+        const container = document.getElementById('container');
+        const testName = "test";
+        const testDescription = "testDescription";
+        ReactDOM.render(
+            <GridCard header={testName} onClick={() => {done();}}>{testDescription}</GridCard>, container);
+        TestUtils.Simulate.keyDown(container.firstElementChild, {key: 'Enter'});
+    });
 });
diff --git a/web/client/components/misc/style/gridcard.css b/web/client/components/misc/style/gridcard.css
index 6386356b14..76872fc763 100644
--- a/web/client/components/misc/style/gridcard.css
+++ b/web/client/components/misc/style/gridcard.css
@@ -3,7 +3,7 @@
     transition: box-shadow 250ms;
 }
 
-.gridcard:hover {
+.gridcard:hover, .gridcard:focus {
     box-shadow: 0 10px 20px rgba(0,0,0,0.19), 0 6px 6px rgba(0,0,0,0.23);
 }
 
diff --git a/web/client/themes/default/less/maps-properties.less b/web/client/themes/default/less/maps-properties.less
index ccee9633bf..6dca4278d6 100644
--- a/web/client/themes/default/less/maps-properties.less
+++ b/web/client/themes/default/less/maps-properties.less
@@ -338,7 +338,7 @@
         .gridcard {
             height: @square-btn-size * 4.5;
             transition: all 0.3s;
-            &:hover {
+            &:hover, &:focus {
                 .shadow-far;
                 cursor: pointer;
                 z-index: 10;