Pens from Szuzs https://codepen.io/szuzs/ en nospam@codepen.io Copyright 2024 2023-08-10T23:04:27-07:00 Blogger contact form with hidden input https://codepen.io/szuzs/pen/vYQqOqb https://codepen.io/szuzs/pen/vYQqOqb Szuzs

See the Code - See it Full Page - See Details

]]>
Blogger contact form with hidden input 2023-08-10T23:04:27-07:00
Typography test https://codepen.io/szuzs/pen/yLQYypZ https://codepen.io/szuzs/pen/yLQYypZ Szuzs

See the Code - See it Full Page - See Details

]]>
Typography test 2023-06-12T21:04:29-07:00
Image with a tag https://codepen.io/szuzs/pen/GRXqKMB https://codepen.io/szuzs/pen/GRXqKMB Szuzs

See the Code - See it Full Page - See Details

]]>
Image with a tag 2023-02-22T23:45:38-07:00
Card with clip-path https://codepen.io/szuzs/pen/mdKEzOQ https://codepen.io/szuzs/pen/mdKEzOQ Szuzs

See the Code - See it Full Page - See Details

Card with image and text, clip-path to hexagon and on hover reveal the text and full (rectangular) image.

]]>
Card with clip-path 2022-11-04T17:53:00-07:00
Countdown to Christmas with JS https://codepen.io/szuzs/pen/MWXyNLK https://codepen.io/szuzs/pen/MWXyNLK Szuzs

See the Code - See it Full Page - See Details

Advent app with JavaSscript: how many days until Chistmas? :-) (In the actual pen it uses a slightly frown face is it is not Christmas.) After Dec 26. it calculates the required days until the next Christmas.

]]>
Countdown to Christmas with JS 2022-11-03T16:53:17-07:00
Title with images in a grid https://codepen.io/szuzs/pen/poKyNRR https://codepen.io/szuzs/pen/poKyNRR Szuzs

See the Code - See it Full Page - See Details

8 random Unsplash images with a title on the center. Placed on a 3x3 grid. The title has variable font size with font family Merienda One (Google Fonts).

]]>
Title with images in a grid 2022-11-02T15:30:56-07:00
Font sytler with editable text https://codepen.io/szuzs/pen/gOKPZMj https://codepen.io/szuzs/pen/gOKPZMj Szuzs

See the Code - See it Full Page - See Details

Second project in the 5 days - 5 projects challange. Font style (font family) helper. Choose from six pre-definied Google font families for an editable h1 title and three editable paragraphs. You can choose font-pairings for the title and the text or edit the font styles separately. The 6 fonts you can choose: Oswald, Roboto and Lobster for the title, and Lora, Lato and Montserrat for the text.

]]>
Font sytler with editable text 2022-11-01T21:50:05-07:00
5 days, 5 projects starter https://codepen.io/szuzs/pen/dyKGYjW https://codepen.io/szuzs/pen/dyKGYjW Szuzs

See the Code - See it Full Page - See Details

This is a starter template and table of contents for the 5 days, 5 project mini-challange. Five projects throughout the workweek, one each day. Hope you like it!

]]>
5 days, 5 projects starter 2022-11-04T17:57:05-07:00
Color slider https://codepen.io/szuzs/pen/xxzwVde https://codepen.io/szuzs/pen/xxzwVde Szuzs

See the Code - See it Full Page - See Details

Color-changing progress bar with a reset button.

]]>
Color slider 2023-02-19T17:08:00-07:00
Blogger label color code test https://codepen.io/szuzs/pen/VwxjLNQ https://codepen.io/szuzs/pen/VwxjLNQ Szuzs

See the Code - See it Full Page - See Details

]]>
Blogger label color code test 2022-10-31T23:31:53-07:00