Skip to content

Commit

Permalink
update web page
Browse files Browse the repository at this point in the history
  • Loading branch information
mitradranirban committed Jan 1, 2025
1 parent e38db9b commit 144f86a
Show file tree
Hide file tree
Showing 7 changed files with 127 additions and 20 deletions.
File renamed without changes.
97 changes: 97 additions & 0 deletions out/index.html
Original file line number Diff line number Diff line change
@@ -0,0 +1,97 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<title>Paribartan Variable Color Font </title>
<style>
@font-face {
font-family: Paribartan;
src: url("Paribartan[MASK,SHDW].woff2") ;
font-weight: normal;
font-style: normal;
MASK -50 50;
SHDW -50 50;

}
@font-palette-values --palette0 {
font-family: Paribartan;
base-palette: 0
}
@font-palette-values --palette1 {
font-family: Paribartan;
base-palette: 1
}
@font-palette-values --palette2 {
font-family: Paribartan;
base-palette: 2
}
@font-palette-values --palette3 {
font-family: Paribartan;
base-palette: 3
}
@font-palette-values --palette4 {
font-family: Paribartan;
base-palette: 4
}
.shadow1{
font-family: Paribartan;
font-variation-settings: "SHDW" -50, "MASK" 10;
}
.shadow2{
font-family: Paribartan;
font-variation-settings: "SHDW" 50, "MASK" -15;
}
.shadow3{
font-family: Paribartan;
font-variation-settings: "SHDW" 0, "MASK" 50;
}
.palette0 {
font-family: Paribartan;
font-palette: --palette0;
}
.palette1 {
font-family: Paribartan;
font-palette: --palette1;
}
.palette2 {
font-family: Paribartan;
font-palette: --palette2;
}
.palette3 {
font-family: Paribartan;
font-palette: --palette3;
}
.palette4 {
font-family: Paribartan;
font-palette: --palette4;
}
.shadow1{
font-family: Paribartan;
font-variation-settings: "SHDW" -50 "MASK" 10;
}
@keyframes animate-shadow{

}
@keyframes animate-color{

}

</style>
</head>
<body>
<div class="palette0 shadow1"> <h1>Paribartan Variable Color Typeface</h1></div>
<div class="palette4 shadow2"><h2>পরিবর্তন রঙীন টাইপফেস </h2></div>
<p> Paribartan is a variable color font created using open source tools </p>
<p> It covers Latin, Extended Latin and Bangla (Bengali) characters</p>
<p> It has Five in-built color palettes </p>
<span class="palette0"> Orange </span>,
<span class="palette1"> Violet </span>,
<span class="palette2"> Grey </span>,
<span class="palette3"> Green </span>, and
<span class="palette4"> Blue </span></p>

<p> It also has 2 custom axes of <span class="shadow2">Shadow</span> and <span class="shadow3">Mask </span>. </p>

</body>
</html>
Binary file added scripts/Paribartan[MASK,SHDW].woff2
Binary file not shown.
50 changes: 30 additions & 20 deletions scripts/index.html
Original file line number Diff line number Diff line change
Expand Up @@ -7,9 +7,11 @@
<style>
@font-face {
font-family: Paribartan;
src: url("Paribartan-VF.woff2");
src: url("Paribartan[MASK,SHDW].woff2") ;
font-weight: normal;
font-style: normal;
MASK -50 50;
SHDW -50 50;

}
@font-palette-values --palette0 {
Expand All @@ -32,58 +34,66 @@
font-family: Paribartan;
base-palette: 4
}
h1{
.shadow1{
font-family: Paribartan;
font-variation-settings: "SHDW" -50 "MASK" 10;
font-variation-settings: "SHDW" -50, "MASK" 10;
}
h2{
.shadow2{
font-family: Paribartan;
font-variation-settings: "SHDW" 50 "MASK" -15;
font-variation-settings: "SHDW" 50, "MASK" -15;
}
p{
.shadow3{
font-family: Paribartan;
font-variation-settings: "SHDW" 30 "MASK" 0;
font-variation-settings: "SHDW" 0, "MASK" 50;
}
.pallete0 {
.palette0 {
font-family: Paribartan;
font-palette: --palette0;
}
.pallete1 {
.palette1 {
font-family: Paribartan;
font-palette: --palette1;
}
.pallete2 {
.palette2 {
font-family: Paribartan;
font-palette: --palette2;
}
.pallete3 {
.palette3 {
font-family: Paribartan;
font-palette: --palette3;
}
.pallete4 {
.palette4 {
font-family: Paribartan;
font-palette: --palette4;
}

.shadow1{
font-family: Paribartan;
font-variation-settings: "SHDW" -50 "MASK" 10;
}
@keyframes animate-shadow{

}

</style>
</head>
<body>
<h1 class="palette0">Paribartan Variable Color Font</h1>
<h2 >
About
</h2>
<div class="shadow1"> <h1>Paribartan Variable Color Font</h1></div>
<div class="palette1"><h2>About </h2></div>
<p> Paribartan is a variable color font created using open source tools</p>
<p> It has Five inbuilt color palettes </p>
<p class="pallete0"> Orange </p>
<p class="palette0"> Orange </p>
<p class="palette1"> Violet </p>
<p class="palette2"> Grey </p>
<p class="palette3"> Green </p>
<p class="palette4"> Blue </p>
<p> and also 2 custom axes of Shadow and Mask </p>

<p> It also has 2 custom axes of
<div class="shadow2">Shadow</div>
and
<div class="shadow3">Mask </div>



</ul>
</body>
</html>
Binary file added sources/ttx/Paribartan[MASK,SHDW].ttf
Binary file not shown.
File renamed without changes.
Binary file added sources/ttx/Paribartan[MASK,SHDW].woff2
Binary file not shown.

0 comments on commit 144f86a

Please sign in to comment.