diff --git a/music/albums.json b/music/albums.json
new file mode 100644
index 0000000..73356a2
--- /dev/null
+++ b/music/albums.json
@@ -0,0 +1,162 @@
+[
+  {
+    "name": "27 Demos",
+    "artist": "Margo Guryan ",
+    "link": "27_demos"
+  },
+  {
+    "name": "Choose your Weapon",
+    "artist": "Hiatus Kaiyote",
+    "link": "choose_your_weapon"
+  },
+  {
+    "name": "Ciao! Baby",
+    "artist": "The Marshmallow Kisses",
+    "link": "ciao_baby"
+  },
+  {
+    "name": "Cosmos",
+    "artist": "Yuji Ohno",
+    "link": "cosmos"
+  },
+  {
+    "name": "Deep Breakfast",
+    "artist": "Ray Lynch",
+    "link": "deep_breakfast"
+  },
+  {
+    "name": "Departing",
+    "artist": "Jesus Molina",
+    "link": "departing"
+  },
+  {
+    "name": "Dune",
+    "artist": "David Matthews",
+    "link": "dune"
+  },
+  {
+    "name": "Each and Every Word Leaves Me Here Alone",
+    "artist": "Foreground Eclipse",
+    "link": "fge_1"
+  },
+  {
+    "name": "Missing, Loving, Suffering",
+    "artist": "Foreground Eclipse",
+    "link": "fge_2"
+  },
+  {
+    "name": "Funky Stuff",
+    "artist": " Jiro Inagaki",
+    "link": "funky_stuff"
+  },
+  {
+    "name": "the first glass beach album",
+    "artist": "Glass Beach",
+    "link": "glass_beach"
+  },
+  {
+    "name": "God's Trashmen Sent to Right the Mess",
+    "artist": "Fievel is Glauque",
+    "link": "gods_trashmen"
+  },
+  {
+    "name": "H.A.Q.Q.",
+    "artist": "Liturgy",
+    "link": "haqq"
+  },
+  {
+    "name": "Her Abiding Memory",
+    "artist": "Pitcher56",
+    "link": "her_abiding_memory"
+  },
+  {
+    "name": "High Society",
+    "artist": "Enon",
+    "link": "high_society"
+  },
+  {
+    "name": "Hold Your Horse Is",
+    "artist": "Hella",
+    "link": "hold_your_horse_is"
+  },
+  {
+    "name": "Hylics 2 Original Soundtrack",
+    "artist": "Chuck Salamone",
+    "link": "hylics2"
+  },
+  {
+    "name": "Iron Hummer Alternative",
+    "artist": "IRONBUNNY",
+    "link": "ironbunny"
+  },
+  {
+    "name": "ITEKOMA HITS",
+    "artist": "Otoboke Beaver",
+    "link": "itekoma_hits"
+  },
+  {
+    "name": "Live at Bush Hall",
+    "artist": "Black Country, New Road",
+    "link": "live_at_bush_hall"
+  },
+  {
+    "name": "Los Desamores de Dewey Martino",
+    "artist": "Dewey Martino",
+    "link": "los_desamores_de_dewey_martino"
+  },
+  {
+    "name": "MACROCOSM",
+    "artist": "BALTHVS",
+    "link": "macrocosm"
+  },
+  {
+    "name": "Make Up City",
+    "artist": "CASIOPEA",
+    "link": "make_up_city"
+  },
+  {
+    "name": "Mass Teen Fainting",
+    "artist": "Plumtree",
+    "link": "mass_teen_fainting"
+  },
+  {
+    "name": "Mint Jams",
+    "artist": "CASIOPEA",
+    "link": "mint_jams"
+  },
+  {
+    "name": "an anxious object",
+    "artist": "mouse on the keys",
+    "link": "mouse_on_the_keys"
+  },
+  {
+    "name": "My Caution Line",
+    "artist": "Citrobal",
+    "link": "my_caution_line"
+  },
+  {
+    "name": "New History Warfare Vol. 3: To See More Light",
+    "artist": "Colin Stetson",
+    "link": "new_history_warfare_3"
+  },
+  {
+    "name": "New Levels New Devils",
+    "artist": "Polyphia",
+    "link": "new_levels_new_devils"
+  },
+  {
+    "name": "Oncle Jazz",
+    "artist": "Men I Trust",
+    "link": "oncle_jazz"
+  },
+  {
+    "name": "One Year Madness",
+    "artist": "Golemm",
+    "link": "one_year_madness"
+  },
+  {
+    "name": "Parousia",
+    "artist": "XI",
+    "link": "parousia"
+  }
+]
diff --git a/music/index.md b/music/index.md
index c4b8332..6327c23 100644
--- a/music/index.md
+++ b/music/index.md
@@ -1,5 +1,31 @@
 # Music
 My favorite songs, albums, and artists
 ## albums
+
+<script id="albums">
+const thisScript = document.getElementById("albums");
+fetch("/music/albums.json")
+    .then((response) => response.json())
+    .then((json) => {
+            let html = "";
+            for (let i = 0; i < json.length; i++) {
+                let album = json[i];
+                let link = "/res/albums/" + album.link + ".webp";
+                let name = album.name;
+                let artist = album.artist;
+                let template = `<figure>
+                <img src="${link}">
+                <figcaption>
+                <b>${name}</b><br/><em>${artist}</em>
+                </figcaption>
+                </figure>`;
+                html = html.concat(template);
+            }
+            let section = document.createElement("section");
+            section.innerHTML = html;
+            thisScript.replaceWith(section); // lol
+        });
+</script>
+
 ## artists
 ## songs
diff --git a/res/albums/27_demos.webp b/res/albums/27_demos.webp
new file mode 100644
index 0000000..55dcf56
Binary files /dev/null and b/res/albums/27_demos.webp differ
diff --git a/res/albums/choose_your_weapon.webp b/res/albums/choose_your_weapon.webp
new file mode 100644
index 0000000..b80e46c
Binary files /dev/null and b/res/albums/choose_your_weapon.webp differ
diff --git a/res/albums/ciao_baby.webp b/res/albums/ciao_baby.webp
new file mode 100644
index 0000000..7f63af0
Binary files /dev/null and b/res/albums/ciao_baby.webp differ
diff --git a/res/albums/cosmos.webp b/res/albums/cosmos.webp
new file mode 100644
index 0000000..1c4a8f9
Binary files /dev/null and b/res/albums/cosmos.webp differ
diff --git a/res/albums/deep_breakfast.webp b/res/albums/deep_breakfast.webp
new file mode 100644
index 0000000..8c2f6d2
Binary files /dev/null and b/res/albums/deep_breakfast.webp differ
diff --git a/res/albums/departing.webp b/res/albums/departing.webp
new file mode 100644
index 0000000..d5c5acd
Binary files /dev/null and b/res/albums/departing.webp differ
diff --git a/res/albums/dune.webp b/res/albums/dune.webp
new file mode 100644
index 0000000..5a5b31b
Binary files /dev/null and b/res/albums/dune.webp differ
diff --git a/res/albums/fge_1.webp b/res/albums/fge_1.webp
new file mode 100644
index 0000000..a046505
Binary files /dev/null and b/res/albums/fge_1.webp differ
diff --git a/res/albums/fge_2.webp b/res/albums/fge_2.webp
new file mode 100644
index 0000000..5fce608
Binary files /dev/null and b/res/albums/fge_2.webp differ
diff --git a/res/albums/funky_stuff.webp b/res/albums/funky_stuff.webp
new file mode 100644
index 0000000..f7c5793
Binary files /dev/null and b/res/albums/funky_stuff.webp differ
diff --git a/res/albums/glass_beach.webp b/res/albums/glass_beach.webp
new file mode 100644
index 0000000..373f7f5
Binary files /dev/null and b/res/albums/glass_beach.webp differ
diff --git a/res/albums/gods_trashmen.webp b/res/albums/gods_trashmen.webp
new file mode 100644
index 0000000..5955af7
Binary files /dev/null and b/res/albums/gods_trashmen.webp differ
diff --git a/res/albums/haqq.webp b/res/albums/haqq.webp
new file mode 100644
index 0000000..7902d07
Binary files /dev/null and b/res/albums/haqq.webp differ
diff --git a/res/albums/her_abiding_memory.webp b/res/albums/her_abiding_memory.webp
new file mode 100644
index 0000000..72265ea
Binary files /dev/null and b/res/albums/her_abiding_memory.webp differ
diff --git a/res/albums/high_society.webp b/res/albums/high_society.webp
new file mode 100644
index 0000000..b3f60c9
Binary files /dev/null and b/res/albums/high_society.webp differ
diff --git a/res/albums/hold_your_horse_is.webp b/res/albums/hold_your_horse_is.webp
new file mode 100644
index 0000000..277fd16
Binary files /dev/null and b/res/albums/hold_your_horse_is.webp differ
diff --git a/res/albums/hylics2.webp b/res/albums/hylics2.webp
new file mode 100644
index 0000000..5c077df
Binary files /dev/null and b/res/albums/hylics2.webp differ
diff --git a/res/albums/ironbunny.webp b/res/albums/ironbunny.webp
new file mode 100644
index 0000000..6fd7783
Binary files /dev/null and b/res/albums/ironbunny.webp differ
diff --git a/res/albums/itekoma_hits.webp b/res/albums/itekoma_hits.webp
new file mode 100644
index 0000000..69f2e17
Binary files /dev/null and b/res/albums/itekoma_hits.webp differ
diff --git a/res/albums/live_at_bush_hall.webp b/res/albums/live_at_bush_hall.webp
new file mode 100644
index 0000000..2c4c2d2
Binary files /dev/null and b/res/albums/live_at_bush_hall.webp differ
diff --git a/res/albums/los_desamores_de_dewey_martino.webp b/res/albums/los_desamores_de_dewey_martino.webp
new file mode 100644
index 0000000..da30e3f
Binary files /dev/null and b/res/albums/los_desamores_de_dewey_martino.webp differ
diff --git a/res/albums/macrocosm.webp b/res/albums/macrocosm.webp
new file mode 100644
index 0000000..15331cc
Binary files /dev/null and b/res/albums/macrocosm.webp differ
diff --git a/res/albums/make_up_city.webp b/res/albums/make_up_city.webp
new file mode 100644
index 0000000..16e871e
Binary files /dev/null and b/res/albums/make_up_city.webp differ
diff --git a/res/albums/mass_teen_fainting.webp b/res/albums/mass_teen_fainting.webp
new file mode 100644
index 0000000..e57d65b
Binary files /dev/null and b/res/albums/mass_teen_fainting.webp differ
diff --git a/res/albums/mint_jams.webp b/res/albums/mint_jams.webp
new file mode 100644
index 0000000..823b2fb
Binary files /dev/null and b/res/albums/mint_jams.webp differ
diff --git a/res/albums/mouse_on_the_keys.webp b/res/albums/mouse_on_the_keys.webp
new file mode 100644
index 0000000..4022a04
Binary files /dev/null and b/res/albums/mouse_on_the_keys.webp differ
diff --git a/res/albums/my_caution_line.webp b/res/albums/my_caution_line.webp
new file mode 100644
index 0000000..c05dc0f
Binary files /dev/null and b/res/albums/my_caution_line.webp differ
diff --git a/res/albums/new_history_warfare_3.webp b/res/albums/new_history_warfare_3.webp
new file mode 100644
index 0000000..d97afaf
Binary files /dev/null and b/res/albums/new_history_warfare_3.webp differ
diff --git a/res/albums/new_levels_new_devils.webp b/res/albums/new_levels_new_devils.webp
new file mode 100644
index 0000000..5f9754a
Binary files /dev/null and b/res/albums/new_levels_new_devils.webp differ
diff --git a/res/albums/oncle_jazz.webp b/res/albums/oncle_jazz.webp
new file mode 100644
index 0000000..92de707
Binary files /dev/null and b/res/albums/oncle_jazz.webp differ
diff --git a/res/albums/one_year_madness.webp b/res/albums/one_year_madness.webp
new file mode 100644
index 0000000..1e86fe0
Binary files /dev/null and b/res/albums/one_year_madness.webp differ
diff --git a/res/albums/parousia.webp b/res/albums/parousia.webp
new file mode 100644
index 0000000..0d5c993
Binary files /dev/null and b/res/albums/parousia.webp differ
diff --git a/res/albums/plantasia.webp b/res/albums/plantasia.webp
new file mode 100644
index 0000000..43822be
Binary files /dev/null and b/res/albums/plantasia.webp differ
diff --git a/res/albums/prince_of_the_cyber_rave.webp b/res/albums/prince_of_the_cyber_rave.webp
new file mode 100644
index 0000000..4f64a1d
Binary files /dev/null and b/res/albums/prince_of_the_cyber_rave.webp differ
diff --git a/res/albums/saved.webp b/res/albums/saved.webp
new file mode 100644
index 0000000..c620623
Binary files /dev/null and b/res/albums/saved.webp differ
diff --git a/res/albums/short_short.webp b/res/albums/short_short.webp
new file mode 100644
index 0000000..d8ed8f6
Binary files /dev/null and b/res/albums/short_short.webp differ
diff --git a/res/albums/the_other_side_of_the_sun.webp b/res/albums/the_other_side_of_the_sun.webp
new file mode 100644
index 0000000..b6f266b
Binary files /dev/null and b/res/albums/the_other_side_of_the_sun.webp differ
diff --git a/res/albums/thick_as_a_brick.webp b/res/albums/thick_as_a_brick.webp
new file mode 100644
index 0000000..69cc8f9
Binary files /dev/null and b/res/albums/thick_as_a_brick.webp differ
diff --git a/res/albums/tokyo-to.webp b/res/albums/tokyo-to.webp
new file mode 100644
index 0000000..e2d4d04
Binary files /dev/null and b/res/albums/tokyo-to.webp differ
diff --git a/res/albums/trilogy.webp b/res/albums/trilogy.webp
new file mode 100644
index 0000000..548eca9
Binary files /dev/null and b/res/albums/trilogy.webp differ
diff --git a/res/albums/twighlight.webp b/res/albums/twighlight.webp
new file mode 100644
index 0000000..9304490
Binary files /dev/null and b/res/albums/twighlight.webp differ
diff --git a/res/albums/visions.webp b/res/albums/visions.webp
new file mode 100644
index 0000000..4a53a2e
Binary files /dev/null and b/res/albums/visions.webp differ
diff --git a/res/albums/wlfgrl.webp b/res/albums/wlfgrl.webp
new file mode 100644
index 0000000..138127f
Binary files /dev/null and b/res/albums/wlfgrl.webp differ
diff --git a/res/albums/wonder_under.webp b/res/albums/wonder_under.webp
new file mode 100644
index 0000000..f815571
Binary files /dev/null and b/res/albums/wonder_under.webp differ
diff --git a/res/albums/wozard_of_iz.webp b/res/albums/wozard_of_iz.webp
new file mode 100644
index 0000000..f7f1501
Binary files /dev/null and b/res/albums/wozard_of_iz.webp differ
diff --git a/res/albums/www.webp b/res/albums/www.webp
new file mode 100644
index 0000000..50430d0
Binary files /dev/null and b/res/albums/www.webp differ
diff --git a/res/albums/young_arrogant.webp b/res/albums/young_arrogant.webp
new file mode 100644
index 0000000..b6602ca
Binary files /dev/null and b/res/albums/young_arrogant.webp differ
diff --git a/style.css b/style.css
index 72c6ded..d752bc7 100644
--- a/style.css
+++ b/style.css
@@ -81,9 +81,27 @@ h1 {
   padding-bottom: 0.2em;
 }
 
-img {
-  width: 40%;
-  height: auto;
-  align-content: center;
-  margin: auto;
+section {
+  content-align: center;
+  text-align: center;
 }
+
+figure {
+  display: inline-block;
+  width: 10em;
+  max-height: 14em;
+  margin: auto;
+  padding: 0.8em;
+}
+
+figcaption {
+  margin-top: 0.4em;
+  line-height: 110%;
+}
+
+img {
+  display: block;
+  width: 100%
+}
+
+