diff --git a/package.json b/package.json
index 0795a12..c308a7a 100644
--- a/package.json
+++ b/package.json
@@ -3,6 +3,7 @@
   "version": "0.1.0",
   "private": true,
   "dependencies": {
+    "@githubprimer/octicons-react": "^8.1.0",
     "axios": "^0.18.0",
     "i": "^0.3.6",
     "node-sass": "^4.9.3",
diff --git a/src/features/Issues/Issues.js b/src/features/Issues/Issues.js
index 853a9e3..4269687 100644
--- a/src/features/Issues/Issues.js
+++ b/src/features/Issues/Issues.js
@@ -3,13 +3,15 @@ import "./Issues.scss";
 import { Link } from "react-router-dom";
 import { connect } from "react-redux";
 import { getIssues, filterIssues } from "./actions";
+import Icon from "../Icon/Icon";
 
 const maxLength = 50;
 
-const Card = ({ title, body, labels, issueUrl, owner, repo, number }) => (
+const Card = ({ title, body, labels, issueUrl, owner, repo, number, state,  pull_request }) => (
   <div className="card" onClick={() => issueUrl(owner, repo, number)}>
     <div className="card-title">
-      <h4>{title}</h4>
+		<Icon state={state} pull={pull_request} />
+        <h4 className={"card-title-text"}>{title}</h4>
     </div>
     <div className="card-body">
       <div>
@@ -123,6 +125,8 @@ class Issues extends Component {
               owner={owner}
               repo={repo}
               number={issue.number}
+              state={issue.state}
+              pull_request={issue.pull_request}
             />
           ))}
         </div>
diff --git a/src/features/Issues/Issues.scss b/src/features/Issues/Issues.scss
index 582718b..a17b765 100644
--- a/src/features/Issues/Issues.scss
+++ b/src/features/Issues/Issues.scss
@@ -129,6 +129,9 @@ button#return-button a {
     padding: 20px;
     font-size: 12px;
   }
+  .card-title-text {
+    display: contents;
+  }
   .card-labels > ul {
     list-style-type: none;
     padding: 15px;
diff --git a/src/features/Issues/components/Icon/Icon.js b/src/features/Issues/components/Icon/Icon.js
new file mode 100644
index 0000000..80650d8
--- /dev/null
+++ b/src/features/Issues/components/Icon/Icon.js
@@ -0,0 +1,33 @@
+import React from "react";
+import "./Icon.scss";
+import Octicon, { getIconByName } from "@githubprimer/octicons-react";
+
+const Icon = ({ state, pull }) => {
+  let icon = "";
+  let color = "";
+  if (state === "open") {
+    if (pull) {
+      icon = "git-pull-request";
+    } else {
+      icon = "issue-opened";
+    }
+    color = "green";
+  } else {
+    if (pull) {
+      icon = "git-merge";
+      color = "purple";
+    } else {
+      icon = "issue-closed";
+      color = "red";
+    }
+  }
+  return (
+    <Octicon
+      size={"medium"}
+      className={`card-icon ${color}`}
+      icon={getIconByName(icon)}
+    />
+  );
+};
+
+export default Icon;
diff --git a/src/features/Issues/components/Icon/Icon.scss b/src/features/Issues/components/Icon/Icon.scss
new file mode 100644
index 0000000..8888da7
--- /dev/null
+++ b/src/features/Issues/components/Icon/Icon.scss
@@ -0,0 +1,12 @@
+.card-icon {
+  margin: 3px;
+  &.green {
+    color: #28a745;
+  }
+  &.red {
+    color: #cb2431;
+  }
+  &.purple {
+    color: #6f42c1;
+  }
+}