diff --git a/src/app/Colors.js b/src/app/Colors.js
new file mode 100644
index 0000000..deb3931
--- /dev/null
+++ b/src/app/Colors.js
@@ -0,0 +1,21 @@
+// @flow
+
+export type HexColor = string;
+
+export default (Object.freeze({
+  brand: Object.freeze({
+    medium: "#0872A2",
+    dark: "#3A066A",
+  }),
+  accent: Object.freeze({
+    medium: "#FF3201",
+  }),
+}): {|
+  +brand: {|
+    +medium: HexColor,
+    +dark: HexColor,
+  |},
+  +accent: {|
+    +medium: HexColor,
+  |},
+|});
diff --git a/src/app/Link.js b/src/app/Link.js
index 129ee1d..4e60603 100644
--- a/src/app/Link.js
+++ b/src/app/Link.js
@@ -4,6 +4,8 @@ import React, {Component} from "react";
 import {Link as RouterLink} from "react-router";
 import {StyleSheet, css} from "aphrodite/no-important";
 
+import Colors from "./Colors";
+
 /**
  * A styled link component for both client-side router links and normal
  * external links.
@@ -47,12 +49,12 @@ const colorAttributes = (color) => ({
 });
 const styles = StyleSheet.create({
   link: {
-    ...colorAttributes("#0872A2"),
+    ...colorAttributes(Colors.brand.medium),
     ":visited": {
-      ...colorAttributes("#3A066A"),
+      ...colorAttributes(Colors.brand.dark),
     },
     ":active": {
-      ...colorAttributes("#FF3201"),
+      ...colorAttributes(Colors.accent.medium),
     },
   },
 });
diff --git a/src/app/Page.js b/src/app/Page.js
index bb4a254..d1e7c47 100644
--- a/src/app/Page.js
+++ b/src/app/Page.js
@@ -4,6 +4,7 @@ import React, {type Node} from "react";
 import {StyleSheet, css} from "aphrodite/no-important";
 
 import type {Assets} from "./assets";
+import Colors from "./Colors";
 import Link from "./Link";
 import GithubLogo from "./GithubLogo";
 import TwitterLogo from "./TwitterLogo";
@@ -134,6 +135,10 @@ const style = StyleSheet.create({
     ":hover": {
       textDecoration: "underline",
     },
+    ":visited:not(:active)": {
+      color: Colors.brand.medium,
+      fill: Colors.brand.medium, // for SVG icons
+    },
   },
   navItemLeft: {
     flex: 1,