Awww, thanks Kornelija! 
I’ve been learning for about a year, I think. But I’ve only completed 16% of the course.
Do you have a link to your GitHub pages page?
Hey there!
I was just fiddling around a bit and these are my results:
Feedback is highly appreciated! 
1 Like
Hi all!
Here is my attempt.
Live: Website Design System
Repository: https://github.com/stuanders/website-design-system.git
2 Likes
This is my attempt
thanks for any helpful tips !
<!DOCTYPE html>
<html>
<head>
<title>Style Guide</title>
<h1>My (Kirby) Website Style Guide</h1>
<link rel="stylesheet" href='styles.css'/>
<link href="https://fonts.googleapis.com/css2?family=Blaka+Hollow&display=swap" rel="stylesheet">
<link href="https://fonts.googleapis.com/css2?family=Lobster&display=swap" rel="stylesheet">
<link href="https://fonts.googleapis.com/css2?family=Pacifico&display=swap" rel="stylesheet">
</head>
<body>
<div class="color-container">
<h2>Colors</h2>
<ul class="crim container">
<li>Crimson</li>
<li>#DC143C</li>
<li>Banner</li>
</ul>
<ul class="gold container">
<li>Dark Golden</li>
<li>#B8860B</li>
<li>body</li>
</ul>
<ul class="magenta container">
<li>Dark Magenta</li>
<li>#8B008B</li>
<li>base color for clickable items </li>
</ul>
<ul class="chartreuse container">
<li>Chartreuse</li>
<li>#7FFF00</li>
<li>mouse hover color</li>
</ul>
<ul class="green container">
<li>Light Green</li>
<li>#90EE90</li>
<li>after click state</li>
</ul>
</div>
<div class="whole-font-container">
<h2>Fonts</h2>
<div class="font-container">
<p class= "Blaka-Hollow title">Blaka Hollow</p>
<p class="Blaka-Hollow regular">The Planes in Spain stay mainly in the plains</p>
<p class="Blaka-Hollow bold">The Planes in Spain stay mainly in the plains</p>
<p class="Blaka-Hollow italic">The Planes in Spain stay mainly in the plains</p>
</div>
<div class= "font-container">
<p class= "Lobster title">Lobster</p>
<p class="Lobster regular">The Planes in Spain stay mainly in the plains</p>
<p class="Lobster bold">The Planes in Spain stay mainly in the plains</p>
<p class="Lobster italic">The Planes in Spain stay mainly in the plains</p>
</div>
<div class="font-container">
<p class= "Pacifico title">Pacifico</p>
<p class="Pacifico regular">The Planes in Spain stay mainly in the plains</p>
<p class="Pacifico bold">The Planes in Spain stay mainly in the plains</p>
<p class="Pacifico italic">The Planes in Spain stay mainly in the plains</p>
</div>
</div>
<div>
<div>
<h3>Text Styles and Whatnots</h3>
<h1>H1: Title</h1>
<ul>
<li>Font Family: Blaka Hollow</li>
<li>Font weight: 700px</li>
<li>Maaaybbee italic</li>
<li>Font Size: 26x</li>
</ul>
</div>
<div>
<h2>H2: Sub Heading</h2>
<ul>
<li>Font Family: Pacifico</li>
<li>font weight: 400px</li>
<li>Font size: 18px</li>
</ul>
</div>
<div>
<h3>Paragraph</h3>
<ul>
<li>Font Family: Lobster</li>
<li>Font weight: 400px</li>
<li>Font size: 9px</li>
</ul>
</div>
</div>
</body>
<footer></footer>
</html>
// css code starts here//
.crim {
background-color: #DC143C;
color: white;
}
.gold{
background-color: #B8860B;
}
.magenta{
background-color: #8B008B;
color: white;
}
.chartreuse{
background-color: #7FFF00;
}
.green {
background-color: #90EE90;
}
.font-name {
font-style: underline;
}
.Lobster {
font-family: Lobster;
}
.Blaka-Hollow {
font-family: Blaka Hollow;
}
.Pacifico {
font-family: Pacifico;
}
.bold {
font-weight: bold;
}
.italic {
font-style: italic;
}
.container{
display: inline-block;
border: 2px solid LightGrey;
}
.font-container {
display: inline-block;
border: 2px solid LightGrey;
}
.whole-font-container {
border:2px solid black;
}
.color-container {
border: 2px solid grey;
}
.title {
font-size: 25px
}
After I had to make a (unintentionally) break in the middle of coding my WDS-challenge-project I unlasting finished my WDS-page. You can find the live-page here and the GitHub-page here. I would be grateful for your feedback.
Soo I can’t seem to figure out why all the content is all over the place, and not within the containers… Any tips?
https://github.com/solveigaarv/My-Website-Style-Guide/tree/main
Hello,
This was the site I created.
https://cpark21.github.io/website_guide/
My css organization definitely needs improving…
Thanks for checking it out.
Hello Folks, please kindly check my recent project.
live : Design Style
code : GitHub - Biggboss7/Website-Design-System: A project from Codecademy to build our own Website Design System
Hope you enjoy it.
Would be glad if you can give me any constructive critic and comments.
Thankyou
2 Likes
Live: My Website Design Style
Repo: GitHub - gzebb/design-system: Code Academy: Build a Website Style Guide Challenge Project (HTML, CSS)
Would appreciate some feedback on what I can do better.
6 Likes
this is my work for this challenge
Hi Zarlana,
congratulations to your page. I really like it, it’s beautiful designed!! 
It also includes many of the things that have been mediated in the CSS-lessons…
1 Like
Hi, a beautiful designed WDS-page!! Congratulations! My favorite one is the ancient-Egyptian lettering that is running in circles…
Hey! Thanks for the review!
That was exactly my idea - to use much of the knowledge that we have gained so far 
Clean!
Really like the style of your page, Keep working hard!
1 Like
Hello
Wanted to be sure if I got the wrong message,thought we were supposed to clone the example
or I’m wrong?
1 Like