-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
111 lines (111 loc) · 6.59 KB
/
index.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="assets/css/style.css">
<title>killetter</title>
<meta name="description" content="Bienvenido a killetter. Estudio méxicano especializado en caligrafía, tipografía y lettering.">
<meta name="keywords" content="DISEÑO, TIPOGRAFÍA, CALIGRAFÍA, LETTERING">
<!-- OPEN GRAPH -->
<meta property="og:tipe" content="website">
<meta property="og:title" content="killetter">
<meta property="og:description" content="Estudio méxicano especializado en caligrafía, tipografía y lettering.">
<meta property="og:image" content="assets/img/imagen-1.png">
<meta property="og:name" content="Killetter Studio">
<!-- Favicon -->
<link rel="icon" type="image/png" sizes="16x16" href="assets/img/favicons/favicon-16x16.png">
<link rel="icon" type="image/png" sizes="32x32" href="assets/img/favicons/favicon-32x32.png">
<link rel="apple-touch-icon" sizes="57x57" href="assets/img/favicons/apple-touch-icon-57x57.png">
<link rel="apple-touch-icon" sizes="60x60" href="assets/img/favicons/apple-touch-icon-60x60.png">
<link rel="apple-touch-icon" sizes="72x72" href="assets/img/favicons/apple-touch-icon-72x72.png">
<link rel="apple-touch-icon" sizes="76x76" href="assets/img/favicons/apple-touch-icon-76x76.png">
<link rel="icon" type="image/png" sizes="96x96" href="assets/img/favicons/apple-touch-icon-96x96.png">
<link rel="apple-touch-icon" sizes="114x114" href="assets/img/favicons/apple-touch-icon-114x114.png">
<link rel="apple-touch-icon" sizes="120x120" href="assets/img/favicons/apple-touch-icon-120x120.png">
<link rel="apple-touch-icon" sizes="144x144" href="assets/img/favicons/apple-touch-icon-144x144.png">
<link rel="apple-touch-icon" sizes="152x152" href="assets/img/favicons/apple-touch-icon-152x152.png">
<link rel="apple-touch-icon" sizes="180x180" href="assets/img/favicons/apple-touch-icon-180x180.png">
<link rel="icon" type="image/png" sizes="192x192" href="assets/img/favicons/android-icon-192x192.png">
<meta name="msapplication-TileColor" content="#ffffff">
<meta name="theme-color" content="#ffffff">
</head>
<body >
<header class="barHeader">
<div class="logo"><a class="logoText" href="index.html">killetter</a></div>
<nav class="navBar">
<ul>
<li><a href="pages/blog.html">Blog</a></li>
<li><a href="pages/proyectos.html">Proyectos</a></li>
<li><a href="pages/tienda.html">Tienda</a></li>
<li><a href="pages/contacto.html">Contacto</a></li>
</ul>
</nav>
</header>
<!-- proyectos -->
<main>
<section class="seccPrincipal">
<div class="seccion">
<h1>Diseño Tipográfico</h1>
<h4>Cemita</h4>
<p>Cemita is a type family inspired
by traditional food from Puebla México, breaded chicken, pork or beef (Milanesa), as well as avocado, quesillo (cheese) and chipotle (smoked and dried jalapeño chili pepper). It is full Its design is
based on it to be a super family with multiple weights and for this project: Cemita Milanesa is the
sans convex forms, Cemita de Pata is the serif version of Milanesa, Cemita Gourmet is the boring sans with straight and round shapes and Cemita quesillo is the fat script with black shapes. Cemita Milanesa,
de Pata and Gourmet counts with 5 weights, oblique version and variable weight axis. My intention with the project is to expand the design space to the width axis and text version.</p>
<a href="pages/proyectos.html">
<button>Ver Proyectos</button>
</a>
</div>
<div class="imageSecc">
<img src="assets/img/imagen-1.png" class="imgPrincipal" alt="Entrar a proyectos">
</div>
</section>
<!-- Blog -->
<section class="seccPrincipal">
<div class="imageSecc">
<img src="assets/img/imagen-2.png" class="imgPrincipal" alt="Entrar a Blog">
</div>
<div class="seccion">
<h2>Blog</h2>
<h4>Lettering Turístico</h4>
<p>Colección de rótulos inspirados en lugares de México. Durante un mes el diseñador poblano Miguel Angel Contreras Cruz dibujo letras inspiradas en lugares con mucha cultura.</p>
<a href="pages/blog.html">
<button>Ver Blog</button>
</a>
</div>
</section>
<!-- Tienda -->
<section class="seccPrincipal">
<div class="seccion ">
<h2>Tienda</h2>
<h4>Cotorra</h4>
<p>Cotorra is a typeface which started like a poster for a school project but I felt that it can be a typeface. Cottora was my first project and I feel so proud of that.
Cotorra is a birdie font with a
full character set ideal to write feathered messages.
Part of the official selection of Tipos Latinos 2016, Latin American Biennale of type design. Published by Letter INC</p>
<a href="pages/tienda.html">
<button>Ver Tienda</button>
</a>
</div>
<div class="imageSecc ">
<img src="assets/img/imagen-20.png" class="imgPrincipal" alt="Entrar a Tienda">
</div>
</section>
</main>
<!-- Footer -->
<footer class="barFooter">
<div class="logo">
<a class="logoTextFoot" href="index.html">killetter</a>
<p>Letras desde 2017</p>
</div>
<nav class="navBarFooter">
<a href="https://www.instagram.com/killetter"><img class="jello-vertical" src="assets/icons/instagram-brands.svg" alt="Logo de instagram"></a>
<a href="https://twitter.com/killettertype"><img class="jello-vertical" src="assets/icons/twitter-brands.svg" alt="Logo de twitter"></a>
<a href="https://www.behance.net/killetter"><img class="jello-vertical" src="assets/icons/behance-brands.svg" alt="Logo de behance"></a>
<a href="https://github.com/miglconts"><img class="jello-vertical" src="assets/icons/github-brands.svg" alt="Logo de github"></a>
</nav>
</footer>
</body>
</html>