diff --git a/styleguide/modules/ROOT/nav.adoc b/styleguide/modules/ROOT/nav.adoc
index fc04999..5d9f5b8 100644
--- a/styleguide/modules/ROOT/nav.adoc
+++ b/styleguide/modules/ROOT/nav.adoc
@@ -50,6 +50,7 @@
 ** xref:dialogs.adoc[]
 ** xref:data-insights-area.adoc[]
 ** xref:dropdowns.adoc[]
+** xref:icons.adoc[]
 ** xref:ui-links.adoc[]
 ** xref:menus.adoc[]
 ** xref:more-options.adoc[]
diff --git a/styleguide/modules/ROOT/pages/icons.adoc b/styleguide/modules/ROOT/pages/icons.adoc
new file mode 100644
index 0000000..d5d702a
--- /dev/null
+++ b/styleguide/modules/ROOT/pages/icons.adoc
@@ -0,0 +1,43 @@
+= Icons
+
+The Couchbase documentation uses Font Awesome V4 icons.
+To find the correct icon name, search the https://fontawesome.com/v4/icons/[Font Awesome V4 icon library^].
+
+To render an icon, use the Antora `icon:` macro followed by the Font Awesome icon name and square brackets:
+
+----
+icon:fontawesome-icon[]
+----
+
+If the Font Awesome icon has hyphens, write it as listed.
+For example, the circle with a plus sign icon icon:plus-circle[] is written as:
+
+----
+icon:plus-circle[]
+----
+
+TIP: To fix your icon's width and keep text aligned in vertical lists, writer `fw` in the square brackets.
+
+To describe a clickable icon in the UI:
+
+* If the icon has a text label, refer to it by its label, followed by the icon in parentheses.
+For example:
++
+----
+Click *Copy* (icon:copy[]).
+----
++
+This renders as: 
++
+Click *Copy* (icon:copy[]).
+
+* If the icon has no text label, refer to it by the icon alone.
+For example:
++
+----
+Click icon:copy[].
+----
++
+This renders as: 
++
+Click icon:copy[].
\ No newline at end of file