Scribd
Upload
19 views2 pages

Seori Stellular Code

This document is an HTML template for a personal website featuring a profile image and a brief introduction about the owner, who goes by nalui or nana. It includes links to social media and mentions interests like coding, music, anime, and gameplays. The page is styled with CSS for a clean, modern look and responsive design.

Uploaded by

Gacha Kpop
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as TXT, PDF, TXT or read online on Scribd
19 views2 pages

Seori Stellular Code

This document is an HTML template for a personal website featuring a profile image and a brief introduction about the owner, who goes by nalui or nana. It includes links to social media and mentions interests like coding, music, anime, and gameplays. The page is styled with CSS for a clean, modern look and responsive design.

Uploaded by

Gacha Kpop
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as TXT, PDF, TXT or read online on Scribd
You are on page 1/ 2

<!

doctype html>
<html>
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>my web site</title>
</head>

<body>
<div class="container">
<div class="left">
<img class="profile"
src="https://i.pinimg.com/564x/2b/43/98/2b4398d7926af17f9fb85742557d723f.jpg"/>
<a href="https://x.com/dollzito">My Link</a>
</div>
<div class="textbox"><mark>about</mark> call me nalui or nana! 20 she
her & pisces. <br/><br/> <mark>loves</mark> 2seok ♡ coding music anime seori and
gameplays. <br/><br/> <mark>to know</mark> selective with follows, mostly rts,
often change my account layout. <br/><br/> © dollzito, 2025. all rights
reserved</div>
</div>
</body>

<style>
@import url('https://fonts.googleapis.com/css2?
family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,10
0;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap');

* {
padding: 0;
margin: 0;
box-sizing: border-box;
font-family: "Poppins", sans-serif;
}

body {
min-height: 100vh;
background: #ececff;
display: flex;
align-items: center;
justify-content: center;
}

.container {
width: 16em;
height: 10em;
background: white;
box-shadow: inset 10px 0px 6px -10px rgba(66,66,66,0.376), inset -10px
0px 6px -10px rgba(66,66,66,0.376), inset 0px 10px 6px -10px #ffffff, inset 0px -
10px 6px -10px rgba(66,66,66,0.376);
border-radius: 0.8em;
padding: 12px;
display: flex;
align-items: center;
flex-wrap: wrap;
gap: 12px;
}

.left {
display: flex;
flex-direction: column;
gap: 12px;
}

.profile {
width: 6em;
height: 6em;
border-radius: 0.5em;
object-fit: cover;
}

a {
color: #9d9dca;
font-size: 13px;
font-weight: 500;
text-decoration: none;
text-align: center;
background: linear-gradient(0deg, rgba(226,226,255,1) 0%,
rgba(250,250,255,1) 100%);
border: 1px solid #c7c7e1;
border-radius: 0.5em;
padding: 4px;
}

a:hover {
color: #ffffff;
background: linear-gradient(0deg, rgba(250,250,255,1) 0%,
rgba(226,226,255,1) 100%);
}

.textbox {
width: 53%;
height: 100%;
font-size: 11px;
line-height: 1.3;
border: 1px solid #c7c7e1;
border-radius: 0.5em;
padding: 9px;
overflow-y: scroll;
}

mark {
color: white;
font-weight: bold;
background: #dadaff;
padding: 0px 5px;
border-radius: 10em;
}
</style>
</html>

You might also like