Pens from Matheus Avellar https://codepen.io/MatheusAvellar/ en nospam@codepen.io Copyright 2024 2018-04-23T23:26:54-07:00 Actual proper CSS text-decoration fade (without using borders!) https://codepen.io/MatheusAvellar/pen/erJbyj https://codepen.io/MatheusAvellar/pen/erJbyj Matheus Avellar

See the Code - See it Full Page - See Details

]]>
Actual proper CSS text-decoration fade (without using borders!) 2018-04-23T23:26:54-07:00
Prototype Flashy ASCII Thing https://codepen.io/MatheusAvellar/pen/mxdjaN https://codepen.io/MatheusAvellar/pen/mxdjaN Matheus Avellar

See the Code - See it Full Page - See Details

You can click on a square to fixate it. I don't really know what the purpose of this is, the idea just came into my mind. Looks pretty, though

]]>
Prototype Flashy ASCII Thing 2018-03-23T00:25:44-07:00
Best Phone Number Form https://codepen.io/MatheusAvellar/pen/peOKra https://codepen.io/MatheusAvellar/pen/peOKra Matheus Avellar

See the Code - See it Full Page - See Details

Late response to the whole "Best Phone Number Form" trend. Oh, well. Here's my go at it.

]]>
Best Phone Number Form 2017-03-27T21:54:05-07:00
The Matrix ending scene https://codepen.io/MatheusAvellar/pen/VPgjzx https://codepen.io/MatheusAvellar/pen/VPgjzx Matheus Avellar

See the Code - See it Full Page - See Details

Final computer scene on the first Matrix movie recreated in web (html / css / js). The timings aren't completely right, but heh, who cares.

]]>
The Matrix ending scene 2017-02-13T22:05:18-07:00
CSS only "CSS IS AWESOME" https://codepen.io/MatheusAvellar/pen/mORRvW https://codepen.io/MatheusAvellar/pen/mORRvW Matheus Avellar

See the Code - See it Full Page - See Details

CSS only "CSS IS AWESOME" slogan-thingie. Based on this mug: http://i.imgur.com/9qzBYbH.jpg

]]>
CSS only "CSS IS AWESOME" 2017-01-22T01:38:18-07:00
Material Design Menu https://codepen.io/MatheusAvellar/pen/vXYzOq https://codepen.io/MatheusAvellar/pen/vXYzOq Matheus Avellar

See the Code - See it Full Page - See Details

Material design inspired 'growing' menu? Not sure what to call it to be honest. No jQuery used.

]]>
Material Design Menu 2016-09-02T18:35:32-07:00
LCD TV - No signal https://codepen.io/MatheusAvellar/pen/vKXwjy https://codepen.io/MatheusAvellar/pen/vKXwjy Matheus Avellar

See the Code - See it Full Page - See Details

Available live at (http://avellar.ml/lcd). An LCD television / monitor screen, mostly in HTML / CSS. Displays "No input signal", cause it's cute. Heavily inspired by http://codepen.io/olegmilshtein/pen/jrWrqV (definitely recommend it!).

]]>
LCD TV - No signal 2016-06-21T02:40:20-07:00
Spectrum https://codepen.io/MatheusAvellar/pen/xVoeRa https://codepen.io/MatheusAvellar/pen/xVoeRa Matheus Avellar

See the Code - See it Full Page - See Details

JS / Canvas wave spectrum, hopefully someday accurate to real life's electromagnetic one. I was bored, okay?

]]>
Spectrum 2016-05-21T18:41:54-07:00
CodePen Profile Customization https://codepen.io/MatheusAvellar/pen/eZoJbO https://codepen.io/MatheusAvellar/pen/eZoJbO Matheus Avellar

See the Code - See it Full Page - See Details

A pen to customize my CodePen's profile page. I mean, they allow me to do it, so here it is.

]]>
CodePen Profile Customization 2016-05-13T18:15:35-07:00
Periodic Naming https://codepen.io/MatheusAvellar/pen/RaOPzd https://codepen.io/MatheusAvellar/pen/RaOPzd Matheus Avellar

See the Code - See it Full Page - See Details

A simple webapp to test if an input can be written entirely using the periodic table's elements' symbols. It does have some issues I couldn't figure how to fix.

]]>
Periodic Naming 2016-05-12T22:26:51-07:00