diff --git a/doc/site/lists.markdown b/doc/site/lists.markdown
index 257a8a3c..2ff03078 100644
--- a/doc/site/lists.markdown
+++ b/doc/site/lists.markdown
@@ -1,3 +1,73 @@
 ^title Lists
 
-**TODO**
\ No newline at end of file
+A list is a compound object that holds a collection of elements identified by integer index. You can create a list by placing a sequence of comma-separated expressions inside square brackets:
+
+    :::dart
+    [1, "banana", true]
+
+Here, we've created a list of three elements. Notice that the elements don't have to be the same type.
+
+## Accessing Elements
+
+You can access an element from a list by calling the [subscript operator](method-calls.html#subscript-operators) on it with the index of the element you want. Like most languages, indexes start at zero:
+
+    :::dart
+    var hirsute = ["sideburns", "porkchops", "'stache"]
+    hirsute[0] // "sideburns".
+    hirsute[1] // "porkchops".
+
+Negative indices counts backwards from the end:
+
+    :::dart
+    hirsute[-1] // "'stache".
+    hirsute[-2] // "porkchops".
+
+It's a runtime error to pass an index outside of the bounds of the list. If you don't know what those bounds are, you can find out using count:
+
+    :::dart
+    hirsute.count // 3.
+
+## Adding elements
+
+Lists are *mutable*, meaning their contents can be changed. You can swap out an existing element in the list using the subscript setter:
+
+    :::dart
+    hirsute[1] = "muttonchops"
+    IO.print(hirsute[1]) // muttonchops.
+
+It's an error to set an element that's out of bounds. To grow a list, you can use `add` to append a single item to the end:
+
+    :::dart
+    hirsute.add("goatee")
+    IO.print(hirsute.count) // 4.
+
+You can insert a new element at a specific position using `insert`:
+
+    :::dart
+    hirsute.insert("soul patch", 2)
+
+The first argument is the value to insert, and the second is the index to insert it at. All elements following the inserted one will be pushed down to make room for it.
+
+It's valid to "insert" after the last element in the list, but only *right* after it. Like other methods, you can use a negative index to count from the back. Doing so counts back from the size of the list *after* it's grown by one:
+
+    :::dart
+    var letters = ["a", "b", "c"]
+    letters.insert("d", 3)   // OK: inserts at end.
+    IO.print(letters)        // ["a", "b", "c", "d"]
+    letters.insert("e", -2)  // Counts back from size after insert.
+    IO.print(letters)        // ["a", "b", "c", "e", "d"]
+
+## Removing elements
+
+The opposite of `insert` is `removeAt`. It removes a single element from a given position in the list. All following items are shifted up to fill in the gap:
+
+    var letters = ["a", "b", "c"]
+    letters.removeAt(1)
+    IO.print(letters) // ["a", "c"]
+
+If you want to remove everything from the list, you can clear it:
+
+    hirsute.clear
+    IO.print(hirsute) // []
+
+**TODO: Ranges, iteration, etc.**
diff --git a/doc/site/style.css b/doc/site/style.css
index 0abc9ca5..f2f9cfd9 100644
--- a/doc/site/style.css
+++ b/doc/site/style.css
@@ -24,6 +24,7 @@ h3 {
 
 h1, h2, h3 {
   color: hsl(195, 90%, 50%);
+  outline: none;
 }
 
 a {
@@ -35,6 +36,19 @@ a:hover {
   color: hsl(195, 70%, 40%);
 }
 
+.header-anchor {
+  display: none;
+}
+
+h2:hover > .header-anchor, h3:hover > .header-anchor {
+  display: inline;
+  color: hsl(195, 30%, 90%);
+}
+
+h2:hover > .header-anchor:hover, h3:hover > .header-anchor:hover {
+  color: hsl(195, 70%, 40%);
+}
+
 p, li {
   font: 17px/26px "Source Sans Pro", georgia, serif;
   margin: 10px 0;
diff --git a/script/generate_docs.py b/script/generate_docs.py
index 1e2561de..784df86e 100755
--- a/script/generate_docs.py
+++ b/script/generate_docs.py
@@ -44,6 +44,17 @@ def format_file(path, skip_up_to_date):
         else:
           print "UNKNOWN COMMAND:", command, args
 
+      elif stripped.startswith('#'):
+        # Add anchors to the headers.
+        index = stripped.find(" ")
+        headertype = stripped[:index]
+        header = stripped[index:].strip()
+        anchor = header.lower().replace(' ', '-')
+        anchor = anchor.translate(None, '.?!:/')
+
+        contents += indentation + headertype
+        contents += '{1} <a href="#{0}" name="{0}" class="header-anchor">#</a>\n'.format(anchor, header)
+
       else:
         contents = contents + line