Pens from Håvard Brynjulfsen https://codepen.io/havardob/ en nospam@codepen.io Copyright 2024 2024-03-07T08:19:12-07:00 Squishy https://codepen.io/havardob/pen/qBvYdXL https://codepen.io/havardob/pen/qBvYdXL Håvard Brynjulfsen

See the Code - See it Full Page - See Details

Hover to see the effect

]]>
Squishy 2024-03-07T08:19:12-07:00
CSS Day Animated Logo https://codepen.io/havardob/pen/xxQxpNP https://codepen.io/havardob/pen/xxQxpNP Håvard Brynjulfsen

See the Code - See it Full Page - See Details

An animated version of the conference CSSDay's logo

]]>
CSS Day Animated Logo 2023-06-07T07:16:48-07:00
Polaroid memories https://codepen.io/havardob/pen/KKGZGLW https://codepen.io/havardob/pen/KKGZGLW Håvard Brynjulfsen

See the Code - See it Full Page - See Details

My take on this week's challenge

]]>
Polaroid memories 2023-05-05T23:44:21-07:00
Play button with :has theme selector https://codepen.io/havardob/pen/MWqMmgb https://codepen.io/havardob/pen/MWqMmgb Håvard Brynjulfsen

See the Code - See it Full Page - See Details

Icons by Phosphor Icons: https://phosphoricons.com/

]]>
Play button with :has theme selector 2023-04-05T21:16:27-07:00
Stepper https://codepen.io/havardob/pen/dyKoOjX https://codepen.io/havardob/pen/dyKoOjX Håvard Brynjulfsen

See the Code - See it Full Page - See Details

A simple, stylistic stepper component using grid.

]]>
Stepper 2022-10-28T06:23:55-07:00
Ukranian flag | No div 💙💛 https://codepen.io/havardob/pen/qBpOaXO https://codepen.io/havardob/pen/qBpOaXO Håvard Brynjulfsen

See the Code - See it Full Page - See Details

The ukranian flag created solely by utilizing one of the body's psuedo-element.

]]>
Ukranian flag | No div 💙💛 2022-03-16T12:09:05-07:00
Timeline | CodePen Challenge https://codepen.io/havardob/pen/xxPqXdO https://codepen.io/havardob/pen/xxPqXdO Håvard Brynjulfsen

See the Code - See it Full Page - See Details

Recreation of this Dribbble shot: https://dribbble.com/shots/16839933-Crew-work-Timeline-Events

]]>
Timeline | CodePen Challenge 2022-02-09T07:58:41-07:00
Modal with scroll and faded text https://codepen.io/havardob/pen/JjrwMRz https://codepen.io/havardob/pen/JjrwMRz Håvard Brynjulfsen

See the Code - See it Full Page - See Details

A simple way to create a modal that never exceed the viewport's height and allows for scroll inside.

]]>
Modal with scroll and faded text 2022-01-18T13:11:06-07:00
Pricing section component https://codepen.io/havardob/pen/RwLYjJR https://codepen.io/havardob/pen/RwLYjJR Håvard Brynjulfsen

See the Code - See it Full Page - See Details

A pricing section component created using details and summary to imitate at tooltip-like-pop-up-effect for additional info.

]]>
Pricing section component 2022-01-11T12:57:38-07:00
Cards https://codepen.io/havardob/pen/PoJapGX https://codepen.io/havardob/pen/PoJapGX Håvard Brynjulfsen

See the Code - See it Full Page - See Details

Recreation of this Dribbble shot designed by the talented Vishnu Prasad: https://dribbble.com/shots/11522673-Landing-Page-Components

]]>
Cards 2022-01-05T14:53:46-07:00