diff --git a/app/components/crate-readme.js b/app/components/crate-readme.js
deleted file mode 100644
index a22e17c0283..00000000000
--- a/app/components/crate-readme.js
+++ /dev/null
@@ -1,13 +0,0 @@
-import Component from '@ember/component';
-
-export default Component.extend({
-  rendered: '',
-
-  didRender() {
-    this._super(...arguments);
-
-    this.element.querySelectorAll('pre > code').forEach(function(node) {
-      window.Prism.highlightElement(node);
-    });
-  },
-});
diff --git a/app/modifiers/highlight-syntax.js b/app/modifiers/highlight-syntax.js
new file mode 100644
index 00000000000..3c0d4fc9bb8
--- /dev/null
+++ b/app/modifiers/highlight-syntax.js
@@ -0,0 +1,10 @@
+/* global Prism */
+import { modifier } from 'ember-modifier';
+
+export default modifier((element, _, { selector }) => {
+  let elements = selector ? element.querySelectorAll(selector) : [element];
+
+  for (let element of elements) {
+    Prism.highlightElement(element);
+  }
+});
diff --git a/app/templates/components/crate-readme.hbs b/app/templates/components/crate-readme.hbs
deleted file mode 100644
index 0308050c294..00000000000
--- a/app/templates/components/crate-readme.hbs
+++ /dev/null
@@ -1 +0,0 @@
-{{html-safe this.rendered}}
diff --git a/app/templates/crate/version.hbs b/app/templates/crate/version.hbs
index b4734582b6e..d75bc8fd76d 100644
--- a/app/templates/crate/version.hbs
+++ b/app/templates/crate/version.hbs
@@ -71,8 +71,8 @@
         {{/if}}
       </div>
       {{#if this.crate.readme}}
-        <section class="crate-readme" aria-label="Readme">
-          <CrateReadme @rendered={{this.crate.readme}} />
+        <section class="crate-readme" aria-label="Readme" {{highlight-syntax selector="pre > code"}}>
+          {{html-safe this.crate.readme}}
         </section>
       {{else}}
         {{#if this.crate.description}}
diff --git a/package-lock.json b/package-lock.json
index 1b9ff904d14..2dfe5cb7756 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -29607,6 +29607,48 @@
         }
       }
     },
+    "ember-modifier": {
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/ember-modifier/-/ember-modifier-1.0.2.tgz",
+      "integrity": "sha512-YyZ6etJpeMTcrtNJvP+NmyJ+uA2DsYAIg4Mxg9ndYPbe6oXnNTnYQbvF7VIIUuY0Z7zfZ0CwCukFVQESBlJ6Eg==",
+      "dev": true,
+      "requires": {
+        "ember-cli-babel": "^7.11.1",
+        "ember-cli-is-package-missing": "^1.0.0",
+        "ember-cli-normalize-entity-name": "^1.0.0",
+        "ember-cli-string-utils": "^1.1.0",
+        "ember-modifier-manager-polyfill": "^1.2.0"
+      }
+    },
+    "ember-modifier-manager-polyfill": {
+      "version": "1.2.0",
+      "resolved": "https://registry.npmjs.org/ember-modifier-manager-polyfill/-/ember-modifier-manager-polyfill-1.2.0.tgz",
+      "integrity": "sha512-bnaKF1LLKMkBNeDoetvIJ4vhwRPKIIumWr6dbVuW6W6p4QV8ZiO+GdF8J7mxDNlog9CeL9Z/7wam4YS86G8BYA==",
+      "dev": true,
+      "requires": {
+        "ember-cli-babel": "^7.10.0",
+        "ember-cli-version-checker": "^2.1.2",
+        "ember-compatibility-helpers": "^1.2.0"
+      },
+      "dependencies": {
+        "ember-cli-version-checker": {
+          "version": "2.2.0",
+          "resolved": "https://registry.npmjs.org/ember-cli-version-checker/-/ember-cli-version-checker-2.2.0.tgz",
+          "integrity": "sha512-G+KtYIVlSOWGcNaTFHk76xR4GdzDLzAS4uxZUKdASuFX0KJE43C6DaqL+y3VTpUFLI2FIkAS6HZ4I1YBi+S3hg==",
+          "dev": true,
+          "requires": {
+            "resolve": "^1.3.3",
+            "semver": "^5.3.0"
+          }
+        },
+        "semver": {
+          "version": "5.7.1",
+          "resolved": "https://registry.npmjs.org/semver/-/semver-5.7.1.tgz",
+          "integrity": "sha512-sauaDf/PZdVgrLTNYHRtpXa1iRiKcaebiKQ1BJdpQlWH2lCvexQdX55snPFyK7QzpudqbCI0qXFfOasHdyNDGQ==",
+          "dev": true
+        }
+      }
+    },
     "ember-moment": {
       "version": "8.0.0",
       "resolved": "https://registry.npmjs.org/ember-moment/-/ember-moment-8.0.0.tgz",
@@ -43864,7 +43906,7 @@
         },
         "is-fullwidth-code-point": {
           "version": "2.0.0",
-          "resolved": false,
+          "resolved": "",
           "integrity": "sha1-o7MKXE8ZkYMWeqq5O+764937ZU8="
         },
         "istanbul-lib-coverage": {
diff --git a/package.json b/package.json
index fac6d0e9a19..2b1793847ce 100644
--- a/package.json
+++ b/package.json
@@ -61,6 +61,7 @@
     "ember-keyboard": "^5.0.0",
     "ember-load-initializers": "^2.1.1",
     "ember-maybe-import-regenerator": "^0.1.6",
+    "ember-modifier": "^1.0.2",
     "ember-moment": "^8.0.0",
     "ember-qunit": "^4.6.0",
     "ember-page-title": "^5.1.0",
diff --git a/tests/modifiers/highlight-syntax-test.js b/tests/modifiers/highlight-syntax-test.js
new file mode 100644
index 00000000000..a023154c2a9
--- /dev/null
+++ b/tests/modifiers/highlight-syntax-test.js
@@ -0,0 +1,37 @@
+import { module, test } from 'qunit';
+import { setupRenderingTest } from 'ember-qunit';
+import { render } from '@ember/test-helpers';
+import { hbs } from 'ember-cli-htmlbars';
+
+module('Modifier | highlight-syntax', function(hooks) {
+  setupRenderingTest(hooks);
+
+  test('uses Prism.js to apply syntax highlighting', async function(assert) {
+    await render(hbs`
+      <pre class="language-rust" {{highlight-syntax}}>
+#[macro_use]
+extern crate bitflags;
+      </pre>
+    `);
+    assert.dom('.token').exists();
+    assert.dom('.keyword').exists({ count: 2 });
+  });
+
+  test('accepts a `selector` argument', async function(assert) {
+    await render(hbs`
+      <div {{highlight-syntax selector=".b"}}>
+        <pre class="language-rust a">
+  #[macro_use]
+  extern crate bitflags;
+        </pre>
+        <pre class="language-rust b">
+  #[macro_use]
+  extern crate bitflags;
+        </pre>
+      </div>
+    `);
+    assert.dom('.a .token').doesNotExist();
+    assert.dom('.b .token').exists();
+    assert.dom('.b .keyword').exists({ count: 2 });
+  });
+});