diff --git a/content/about.html b/content/about.html
new file mode 100644
index 000000000..c2bcbe91b
--- /dev/null
+++ b/content/about.html
@@ -0,0 +1,30 @@
+<!DOCTYPE html>
+<html lang = "en">
+    <head>
+        <meta charset="utf-8">
+        <title>Iris Lux - Junior Developer</title>
+        <link href ="../stylesheets/style.css" rel = "stylesheet">
+        <link href="../stylesheets/about.css" rel = "stylesheet">
+    </head>
+    <body>
+        <header class="navigation-menu">
+            <h1>Iris Lux - Junior Developer</h1>
+            <nav>
+                <div class = "nav-link"><a href="index.html">Home</a></div>
+                <div class = "nav-link"><a href="about.html">About</a></div>
+                <div class = "nav-link"><a href="code-journal.html">Code Journal</a></div>
+                <div class = "nav-link"><a href="portfolio.html">Portfolio</a></div>
+            </nav>
+        </header>
+        <main>
+            <img src="../images/iris-lux.jpg" alt ="head-on shot of Iris wearing a red dress">
+            <section>
+                <h2>About Me</h2>
+                <p class = "large-text">
+                    Junior developer and writer. Currently a student at Ada Developer Academy. I know how to code in Ruby, CSS and HTML. My interests include natural language processing and digital privacy.
+                </p>
+            </section>
+        </main>
+        <footer>Copyright 2020 Iris Lux</footer>
+    </body>
+</html>
\ No newline at end of file
diff --git a/content/code-journal.html b/content/code-journal.html
new file mode 100644
index 000000000..4751920c2
--- /dev/null
+++ b/content/code-journal.html
@@ -0,0 +1,58 @@
+<!DOCTYPE html>
+<html lang = "en">
+    <head>
+        <meta charset="utf-8">
+        <title>Iris Lux - Junior Developer</title>
+        <link href ="../stylesheets/style.css" rel = "stylesheet">
+    </head>
+    <body>
+        <header class="navigation-menu">
+            <h1>Iris Lux - Junior Developer</h1>
+            <nav>
+                <div class = "nav-link"><a href="index.html">Home</a></div>
+                <div class = "nav-link"><a href="about.html">About</a></div>
+                <div class = "nav-link"><a href="code-journal.html">Code Journal</a></div>
+                <div class = "nav-link"><a href="portfolio.html">Portfolio</a></div>
+            </nav>
+        </header>
+        <main>
+            <h2>Code Journal</h2>
+            <ul class = items>
+                <li>
+                    <article>
+                        <h4>Yoricking</h4>
+                        <p>
+                            Yoricking is much like rubber-ducking, except the rubber duck is replaced with a human skull, or a facsimile if a real skull is not available. The name comes from Hamlet's dead companion, who's skull Hamlet speaks to throughout the play.
+                        </p>
+                        <p>
+                            Why talk to a skull to work out your code problems instead of a duck?  First off, verisimilitude. It's much easier to imagine you're conversing with a human if you're holding human remains in your hand. Secondly, skulls don't squeak - you can't idly squeak a skull and annoy your coworkers during a work zoom meeting. Thirdly, the skull will remind you of impermanence and the inevitability of death, encouring you to live with spontaneity. I'm not sure how that last one will help you code, but it's a bonus.
+                        </p>
+                    </article>
+                </li>
+                <li>
+                    <article>
+                        <h4>The CSV:Table Class in Ruby</h4>
+                        <p>
+                            CSV:Tables are two-dimensional objects used to access and manipulate CSV tables. They contain a series of CSV:Row objects, which are similar to arrays but can access elements by both a header and index. CSV:Table and CSV:Row objects both belong to the “Enumerable” module, and thus can access a bevy of methods useful for solving these problems, such as find(), group_by(), and filter().
+                        </p>
+                    </article>
+                </li>
+                <li>
+                    <article>
+                        <h4>How I Got Started in Ruby</h4>
+                        <p>
+                            A few people close to me are programmers. A couple months ago we chatted about my prior encounters with coding - high school computer science, a grad school SQL class. These talks  reminded me that coding could be a profession that engages my creativity.
+                        </p>
+                        <p>
+                            After those conversations, I began teaching myself Ruby. Initially, I worried that I’d return to code and find it boring. The opposite happened. I fell in love with Ruby.  I scoured the internet for tutorials, starting with basic data types, then proceeding to headier topics: blocks, regular expressions, object-oriented design. Each morsel of knowledge made me crave more.
+                        </p>
+                        <p>
+                            I love the endorphin hit of solving a difficult problem the most. Sure, I enjoy the flow of coding: breaking down a problem, creating a strategy, writing and rewriting the program that solves it. If I were more enlightened, maybe the journey would trump the destination. But when I see code run precisely how it should, I’m so happy I let out a yelp of joy.
+                        </p>
+                    </article>
+                </li>
+            </ul>
+        </main>
+        <footer>Copyright 2020 Iris Lux</footer>
+    </body>
+</html>
\ No newline at end of file
diff --git a/content/index.html b/content/index.html
new file mode 100644
index 000000000..ef308be9e
--- /dev/null
+++ b/content/index.html
@@ -0,0 +1,25 @@
+<!DOCTYPE html>
+<html lang = "en">
+    <head>
+        <meta charset="utf-8">
+        <title>Iris Lux - Junior Developer</title>
+        <link href ="../stylesheets/style.css" rel = "stylesheet">
+        <link href="../stylesheets/index.css" rel = "stylesheet">
+    </head>
+    <body>
+        <header>
+            <h1>Iris Lux - Junior Developer</h1>
+            <nav>
+                <div class = "nav-link"><a href="index.html">Home</a></div>
+                <div class = "nav-link"><a href="about.html">About</a></div>
+                <div class = "nav-link"><a href="code-journal.html">Code Journal</a></div>
+                <div class = "nav-link"><a href="portfolio.html">Portfolio</a></div>
+            </nav>
+        </header>
+        <main>
+            <h2>Iris Lux</h2>
+            <p class = large-text>Junior developer and writer. Currently a student at Ada Developer's Academy</p>
+        </main>
+        <footer>Copyright 2020 Iris Lux</footer>
+    </body>
+</html>
\ No newline at end of file
diff --git a/content/portfolio.html b/content/portfolio.html
new file mode 100644
index 000000000..fca84a917
--- /dev/null
+++ b/content/portfolio.html
@@ -0,0 +1,37 @@
+<!DOCTYPE html>
+<html lang = "en">
+    <head>
+        <meta charset="utf-8">
+        <title>Iris Lux - Junior Developer</title>
+        <link href ="../stylesheets/style.css" rel = "stylesheet">
+    </head>
+    <body>
+        <header class="navigation-menu">
+            <h1>Iris Lux - Junior Developer</h1>
+            <nav>
+                <div class = "nav-link"><a href="index.html">Home</a></div>
+                <div class = "nav-link"><a href="about.html">About</a></div>
+                <div class = "nav-link"><a href="code-journal.html">Code Journal</a></div>
+                <div class = "nav-link"><a href="portfolio.html">Portfolio</a></div>
+            </nav>
+        </header>
+        <main>
+            <h2>Portfolio</h2>
+            <ul class = items>
+                <li>
+                    <h4><a href = "https://github.com/iris-lux/oo-rideshare-mixin">Ride Share</a></h4>
+                    <p>This rideshare program reads in information about drivers, passengers, and rides from a CSV file.</p>
+                </li>
+                <li>
+                    <h4><a href = "https://github.com/iris-lux/slack-cli">Slack CLI</a></h4>
+                    <p>This program allows you to access data about a slack workspace, and send messages through a command-line interface.</p>
+                </li>
+                <li>
+                    <h4><a href = "https://github.com/iris-lux/adagrams">Adagrams</a></h4>
+                    <p>A fun command-line word game</p>
+                </li>
+            </ul>
+        </main>
+        <footer>Copyright 2020 Iris Lux</footer>
+    </body>
+</html>
\ No newline at end of file
diff --git a/images/iris-lux.jpg b/images/iris-lux.jpg
new file mode 100644
index 000000000..99aabe96c
Binary files /dev/null and b/images/iris-lux.jpg differ
diff --git a/stylesheets/about.css b/stylesheets/about.css
new file mode 100644
index 000000000..78d22c427
--- /dev/null
+++ b/stylesheets/about.css
@@ -0,0 +1,3 @@
+main{
+    flex-direction: row;
+}
\ No newline at end of file
diff --git a/stylesheets/style.css b/stylesheets/style.css
new file mode 100644
index 000000000..ef62a1df2
--- /dev/null
+++ b/stylesheets/style.css
@@ -0,0 +1,96 @@
+body {
+    font-family: Gotham, helvetica, sans-serif;
+    color: #404040;
+    width: 100%;
+    line-height: 150%;
+    align-items: stretch;
+    display: flex;
+    flex-direction: column;
+    min-height: 100vh;
+}
+
+header{
+    position: fixed;
+    background-color: red;
+    width: 100%;
+}
+
+h1{
+    text-align: center;
+    font-size: 20px;
+    margin-top: 1em;
+    margin-bottom: 0;
+}
+
+h2 {
+    margin-top: 1em;
+    font-size: 50px;
+    margin-bottom: 1em;
+}
+
+nav{
+    background-image: linear-gradient(red, magenta);
+    display: flex;
+    justify-content: center;
+    flex-direction: row;
+    align-items: center;
+    width: 100%;
+    margin: 0;
+}
+
+.nav-link {
+    padding: 0 15px 0 0;
+    margin: 10px;
+}
+
+a {
+    color: #fff;
+    text-decoration: none;
+}
+
+a:hover {
+    color: black;
+}
+
+
+footer  {
+    margin-top: 1em;
+    font-size: 10px
+}
+
+main{
+    padding: 0 15px 0 0;
+    margin-top: 100px;
+    color: #fff;
+    background-color: mediumpurple;
+    display: flex;
+    justify-content: center;
+    flex-direction: column;
+    text-align: center;
+}
+
+.items {
+    display: flex;
+    flex-direction: column;
+    flex-wrap: wrap;
+    justify-content: space-between;
+    align-content: center;
+    list-style: none;
+}
+
+.items li {
+    background-color: grey;
+    width: 40%;
+    margin: 4px;
+    border-style: solid;
+}
+
+.items li p{
+    width:98%;
+    text-align: left;
+    margin: 4px 4px 1em;
+}
+
+.large-text {
+    font-size: 25px;
+}
\ No newline at end of file
