README / index.html
mshojaei77's picture
Update index.html
417d7dc verified
Raw
History Blame Contribute Delete
2.57 kB
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta
name="description"
content="PersianML develops open models, datasets, and benchmarks for Persian AI."
>
<title>PersianML</title>
<style>
:root {
--cream: #fffaf2;
--ink: #17231f;
--muted: #66736d;
--red: #d92835;
--green: #078f65;
--blue: #4469ce;
--saffron: #e9a82e;
}
* {
box-sizing: border-box;
}
body {
min-height: 100vh;
margin: 0;
display: grid;
place-items: center;
padding: 32px;
color: var(--ink);
background:
radial-gradient(circle at 12% 20%, #d9283514, transparent 30%),
radial-gradient(circle at 88% 78%, #078f6518, transparent 32%),
var(--cream);
font-family: Inter, system-ui, -apple-system, "Segoe UI", sans-serif;
}
main {
width: min(820px, 100%);
}
.label {
color: var(--red);
font-size: 12px;
font-weight: 900;
letter-spacing: .14em;
text-transform: uppercase;
}
h1 {
margin: 14px 0 20px;
font-size: clamp(64px, 12vw, 110px);
line-height: .9;
letter-spacing: -.08em;
}
h1 span {
color: var(--green);
}
p {
max-width: 680px;
margin: 0;
color: var(--muted);
font-size: clamp(18px, 2.5vw, 22px);
line-height: 1.55;
}
.areas {
display: flex;
flex-wrap: wrap;
gap: 10px;
margin-top: 34px;
}
.area {
padding: 9px 14px;
border-radius: 999px;
font-size: 13px;
font-weight: 800;
}
.text {
color: var(--red);
background: #d9283512;
}
.speech {
color: var(--green);
background: #078f6514;
}
.vision {
color: var(--blue);
background: #4469ce14;
}
.evaluation {
color: #9a6700;
background: #e9a82e1c;
}
</style>
</head>
<body>
<main>
<div class="label">Open Persian AI</div>
<h1>Persian<span>ML</span></h1>
<p>
We develop open models, datasets, and benchmarks for Persian text,
speech, OCR, document understanding, and multimodal AI.
</p>
<div class="areas">
<span class="area text">Text &amp; Language</span>
<span class="area speech">ASR &amp; TTS</span>
<span class="area vision">Vision &amp; OCR</span>
<span class="area evaluation">Data &amp; Evaluation</span>
</div>
</main>
</body>
</html>