Diagonal Hero
Hero section variation with diagonal edges.
Copy:
View demo
Dependencies
All components are built upon the CodyHouse Framework.
If you're using this component, you should also include the SCSS/JS of the following components:
- 📦 Hero
This component includes variations. All variations share the same SCSS/JS code. They only differ in the HTML part.
How to
The Diagonal Hero component is a variation of the hero component: the background is skewed in order to create diagonal edges.
The effect is created with the help of the clip-path property, applied to the &::before pseudo-element of the .hero section.
🌄Image credits:
- img by Wolfgang Hasselmann
Bug Report & Feedback
Get in touch: suggest a component or report a bug.