diff --git a/internal/views/articles/list.templ b/internal/views/articles/list.templ
index f26095f..653047b 100644
--- a/internal/views/articles/list.templ
+++ b/internal/views/articles/list.templ
@@ -1,15 +1,27 @@
 package articles
 
 import (
-    "git.jamestombleson.com/jtom38/newsbot-portal/internal/views/layout"
-    "git.jamestombleson.com/jtom38/newsbot-portal/internal/models"
+	"git.jamestombleson.com/jtom38/newsbot-portal/internal/views/layout"
+	"git.jamestombleson.com/jtom38/newsbot-portal/internal/models"
 )
 
 templ List(model models.ListArticlesViewModel) {
-    @layout.WithTemplate() {
-        for _, item := range model.Items {
-            { item.Title }
-        }
-        <div>hi </div>
-    }
-}
\ No newline at end of file
+	@layout.WithTemplate() {
+		for _, item := range model.Items {
+			<div class="card">
+				<div class="card-image">
+					<figure class="is-4by3">
+						<img src={ item.Thumbnail }/>
+					</figure>
+				</div>
+				<div class="card-content">
+					<div class="media">
+						<div class="media-content">
+							<a href={ templ.SafeURL(item.Url) }>{ item.Title }</a>
+						</div>
+					</div>
+				</div>
+			</div>
+		}
+	}
+}