diff --git a/new_twitter.css b/new_twitter.css
new file mode 100644
index 00000000..b9e379d9
--- /dev/null
+++ b/new_twitter.css
@@ -0,0 +1,243 @@
+*{
+    margin: 0;
+}
+.container{
+    display:grid;
+    height: 100vh;
+    grid-template:
+    'left-sidebar main right-sidebar'/300px 1fr 300px
+}
+.logo{
+    img{
+    height:40px;
+    width:47px;
+    padding-left:5px
+    }
+}
+.left-sidebar{
+    grid-area:left-sidebar;
+    background-color: rgb(255, 255, 255);
+    padding-left: 10px;
+    padding-top: 10px;
+    padding-right:100px
+}
+.left-buttons{
+    display:grid;
+    height:80vh;
+    gap:10px;
+    grid-template-rows: 40px 40px 40px 40px 40px 40px 40px 40px;
+    border-radius:20px;
+}
+.home-btn{
+    text-align:left ;
+    border-radius: 13px;
+    padding-left: 15px;
+    border: none;
+    cursor: pointer;
+    background-color: white;
+    font-size: 15px;
+    font-family: 'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif;
+    font-weight: 700;
+    img{
+        height: 25px;
+    }
+}
+.home-btn:hover{
+    background-color: rgb(77, 170, 224);
+}
+.explore-btn{
+    text-align:left ;
+    border-radius: 13px;
+    padding-left: 15px;
+    border: none;
+    cursor: pointer;
+    background-color: white;
+    font-size: 15px;
+    font-family: 'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif;
+    font-weight: 700;
+    img{
+        height: 25px;
+    }
+}
+.explore-btn:hover{
+    background-color: rgb(77, 170, 224);
+}
+.notif-btn{
+    text-align:left ;
+    border-radius: 13px;
+    padding-left: 15px;
+    border: none;
+    cursor: pointer;
+    background-color: white;
+    font-size: 15px;
+    font-family: 'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif;
+    font-weight: 700;
+    img{
+        height: 25px;
+    }
+}
+.notif-btn:hover{
+    background-color: rgb(77, 170, 224);
+}
+.messages-btn{
+    text-align:left ;
+    border-radius: 13px;
+    padding-left: 15px;
+    border: none;
+    cursor: pointer;
+    background-color: white;
+    font-size: 15px;
+    font-family: 'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif;
+    font-weight: 700;
+    img{
+        height: 25px;
+    }
+}
+.messages-btn:hover{
+    background-color: rgb(77, 170, 224);
+}
+.bookmarks-btn{
+    text-align:left ;
+    border-radius: 13px;
+    padding-left: 15px;
+    border: none;
+    cursor: pointer;
+    background-color: white;
+    font-size: 15px;
+    font-family: 'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif;
+    font-weight: 700;
+    img{
+        height: 25px;
+    }
+}
+.bookmarks-btn:hover{
+    background-color: rgb(77, 170, 224);
+}
+.profile-btn{
+    text-align:left ;
+    border-radius: 13px;
+    padding-left: 15px;
+    border: none;
+    cursor: pointer;
+    background-color: white;
+    font-size: 15px;
+    font-family: 'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif;
+    font-weight: 700;
+    img{
+        height: 25px;
+    }
+}
+.profile-btn:hover{
+    background-color: rgb(77, 170, 224);
+}
+.more-btn{
+    text-align:left ;
+    border-radius: 13px;
+    padding-left: 15px;
+    border: none;
+    cursor: pointer;
+    background-color: white;
+    font-size: 15px;
+    font-family: 'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif;
+    font-weight: 700;
+    img{
+        height: 25px;
+    }
+}
+.more-btn:hover{
+    background-color: rgb(77, 170, 224);
+}
+.tweet-button{
+    color: white;
+    background-color: rgb(77, 170, 224);
+    border: none;
+    cursor: pointer;
+    border-radius: 13px;
+    font-family:'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif;
+    font-weight: 400;
+    font-size:19px;
+}
+.main{
+    grid-area:main;
+    background-color: rgb(255, 255, 255);
+    padding: 20px;
+    font-family: 'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif;
+}
+.twitter-profile{
+    padding:10px;
+    img{
+        height:60px;
+        width: 60px;
+        padding-left: 11px;
+    }
+}
+.feed{
+    display: grid;
+    height: 80vh;
+    grid-template-rows: 100px 100px 100px;
+    
+}
+.feed div{
+    background-color: rgb(255, 255, 255);
+    /* border:1px solid lightblue; */
+}
+.tweet-message{
+    display: grid;
+    grid-template:'twitter-profile twitter-message'/100px 1fr;
+    /* padding-bottom: 80px; */
+    font-family: sans-serif;
+    font-size: 17px;
+    color: rgb(0, 0, 0);
+    text-align:left;
+}
+.tweet-message div{
+    background-color: rgb(255, 252, 252);
+}
+.twitter-profile2{
+    img{
+        height: 65px;
+        width: 65px;
+        padding-left: 21px;
+    }
+}
+.tweet1{
+    display: grid;
+    grid-template:'twitter-profile2 twitter-text1'/100px 1fr;
+    /* padding-bottom:80px; */
+    font-family:sans-serif;
+    font-size: 17px;
+    color: rgb(0, 0, 0);
+    text-align: left;
+}
+.right-sidebar{
+    grid-area:right-sidebar;
+    background-color: rgb(255, 255, 255);
+    padding:20px;
+    padding-top: 20px;
+}
+.searchbar{
+    display:grid;
+    height: 5vh;
+    grid-template-rows: 40px 60px 60px;
+    gap:10px;
+    img{
+        height: 20px;
+        width:20px;
+        padding-top: 10px;
+        padding-left: 10px;
+    }
+}
+.searchbar div{
+    background-color: rgba(77, 170, 224, 0.515);
+    border-radius: 13px;
+}
+.text1{
+    font-size: 20px;
+    font-family: 'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif;
+    padding: 10px;
+}
+.text2{
+    font-size: 20px;
+    font-family: 'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif;
+    padding: 10px;
+}
\ No newline at end of file
diff --git a/new_twitter.html b/new_twitter.html
new file mode 100644
index 00000000..4e812b6c
--- /dev/null
+++ b/new_twitter.html
@@ -0,0 +1,72 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <link rel="stylesheet" href="./new_twitter.css" />
+</head>
+<body>
+    <div class = 'container'>
+        <div class = 'left-sidebar'>
+            <div class = 'logo'>
+                <img src = 'https://upload.wikimedia.org/wikipedia/commons/thumb/6/6f/Logo_of_Twitter.svg/512px-Logo_of_Twitter.svg.png' alt ='twitter-logo'/>
+            </div>
+            <div class = 'left-buttons'>
+                <button class="home-btn">
+                    <img src = 'https://marketplace.canva.cn/c4Sds/MAEwo6c4Sds/1/tl/canva-MAEwo6c4Sds.png' alt = 'png-of-house-icon'/>
+                </i>Home</button>
+                <button class="explore-btn">
+                    <img src = 'https://cdn-icons-png.flaticon.com/512/158/158740.png' alt = 'png-of-search-icon'/>
+                </i>Explore</button>
+                <button class="notif-btn">
+                    <img src = 'https://www.iconpacks.net/icons/1/free-bell-icon-860-thumb.png' alt = 'png-of-notif-icon'/>
+                </i>Notifications</button>
+                <button class="messages-btn">
+                    <img src = 'https://icons.veryicon.com/png/o/internet--web/lobomeeting_web_designsystem/message-16.png' alt = 'png-of-message-icon'/>
+                </i>Messages</button>
+                <button class="bookmarks-btn">
+                    <img src = 'https://cdn-icons-png.flaticon.com/512/494/494568.png' alt = 'png-of-bookmark-icon'/>
+                </i>Bookmarks</button>
+                <button class="profile-btn">
+                    <img src = 'https://cdn-icons-png.flaticon.com/512/3106/3106773.png' alt = 'png-of-profile-icon'/>
+                </i>Profile</button>
+                <button class="more-btn">
+                    <img src = 'https://cdn-icons-png.flaticon.com/512/152/152529.png' alt = 'png-of-more-icon'/>
+                </i>More</button>
+                <button class="tweet-button"><i class="fa fa-home"></i>Tweet</button>
+            </div>
+        </div>
+        <div class = 'main'>
+            <h1>Home</h1>
+            <br><br>
+            <div class = 'feed'>
+                <div class = 'tweet-message'>
+                    <div class = 'twitter-profile'>
+                    <img src = 'https://static-00.iconduck.com/assets.00/profile-circle-icon-2048x2048-cqe5466q.png' alt='twitter-profile-dp'/></div>
+                    <div class = 'tweet-text'>
+                        <strong>Sami</strong><font color='lightgray'>@samisalehsaeed · 30m</font><br><br>
+                    I'm currently loving the Boolean UK course!</div>
+                </div>
+                <div class = 'tweet1'>
+                    <div class = 'twitter-profile2'>
+                        <img src = 'https://tr.rbxcdn.com/1623b394780fcdd69abfd2519827de58/420/420/Hat/Png' alt = 'png-of-profile-icon'/>
+                    </div>
+                    <div class = 'tweet-text2'>
+                        <strong>Nathan</strong><font color = 'lightgray'>@vherus · 1hr </font><br><br>
+                    Do not use chatGPT.</div>
+                </div>
+            </div>
+        </div>
+        <div class = 'right-sidebar'>
+            <div class = 'searchbar'>
+                <div>
+                    <img src ='https://cdn-icons-png.flaticon.com/512/158/158740.png' alt ='png-of-search-icon'/>
+                </div>
+                <div class = 'text1'><strong>What's happening?</strong></div>
+                <div class = 'text2'><strong>Who to follow</strong></div>
+            </div>
+        </div>
+
+    </div>
+</body>
+</html>
\ No newline at end of file