Hero-kirjaston mallit ovat niin sanottuja ‘heroja’, eli sivun ensimmäisiksi elementeiksi tarkoitettuja malleja. Toki mikään ei estä käyttämästä näitä missä kohtaa sivua tahansa. Kuva, kuvan päällä oleva taustaväri, tekstit ja painikkeet ovat helposti muutettavissa joka mallissa.

Lohkomalli ’Hero 1 (100% height)’:

Koko ruudun korkuinen hero, jossa tekstipaikka keskitetty pystysuunnassa. Paikka otsikolle, tekstille ja painikkeille.

---

---

Lohkomalli ’Hero 2’:

Simppeli hero-malli, jossa paikka kuvalle, otsikolle, tekstille ja painikkeille.

---

---

Lohkomalli ’Hero 3’:

Malli, jossa kuvan päällä paikka ikonille, otsikolle, kuvaustekstille ja painikkeelle/painikkeille.

---

---

Lohkomalli ’Hero 4 (with video)’:

Hero malli, jossa käytetty taustakuvan sijaan taustavideota.

---

---

Lohkomalli ’Hero 5 (100% height, parallax)’:

Koko ruudun korkuinen hero, jossa on tekstipaikka keskitetty pystysuunnassa. Paikka otsikolle, tekstille ja painikkeille. Kuvassa parallax-efekti.

---

---

Lohkomalli ’Hero 6’:

Hero 6 on koko ruudun korkuinen hero, jossa alaosaan kiinnitetty tietyn taustavärin omaava tekstiboksi.

---

---

Lohkomalli ’Hero 7’:

Hero, jossa otsikko, tekstialue ja painikepaikka on varjostettu taustakuvaan nähden.

---

---

Lohkomalli ’Simple hero with title’:

Simppeli hero malli, jossa h1 paikka keskitetty.

---

---