Pens from Mustafa Genç https://codepen.io/mustafagenc/ en nospam@codepen.io Copyright 2024 2019-07-17T14:38:15-07:00 Test https://codepen.io/mustafagenc/pen/MNgVZm https://codepen.io/mustafagenc/pen/MNgVZm Mustafa Genç

See the Code - See it Full Page - See Details

]]>
Test 2019-07-17T14:38:15-07:00
Responsive Accordion to Tabs https://codepen.io/mustafagenc/pen/KGyrRX https://codepen.io/mustafagenc/pen/KGyrRX Mustafa Genç

See the Code - See it Full Page - See Details

A constant work in progress

]]>
Responsive Accordion to Tabs 2018-10-15T22:08:25-07:00
SVG CSS3 Menu / Burger Button https://codepen.io/mustafagenc/pen/dgVpxm https://codepen.io/mustafagenc/pen/dgVpxm Mustafa Genç

See the Code - See it Full Page - See Details

Professor X -> Wolverine. A collection of svg + svg masking combined with HTML and CSS3 animations used to create a nifty button, I wrote a thing about why I had to mask and explained in more detail what's happening here: https://raygun.io/blog/2014/07/making-svg-html-burger-button/

]]>
SVG CSS3 Menu / Burger Button 2018-10-14T02:22:10-07:00
Reponsive Bootstrap Tabs https://codepen.io/mustafagenc/pen/vVmpVM https://codepen.io/mustafagenc/pen/vVmpVM Mustafa Genç

See the Code - See it Full Page - See Details

A different approach for responsive bootstrap tabs.

]]>
Reponsive Bootstrap Tabs 2018-10-10T22:47:03-07:00
Timeline https://codepen.io/mustafagenc/pen/rrxzQJ https://codepen.io/mustafagenc/pen/rrxzQJ Mustafa Genç

See the Code - See it Full Page - See Details

]]>
Timeline 2018-07-15T16:12:03-07:00
Mobile Menu Icon https://codepen.io/mustafagenc/pen/yEmPdG https://codepen.io/mustafagenc/pen/yEmPdG Mustafa Genç

See the Code - See it Full Page - See Details

]]>
Mobile Menu Icon 2018-07-07T23:41:39-07:00
Menu "Hamburger" Icon Animations https://codepen.io/mustafagenc/pen/mKNqYm https://codepen.io/mustafagenc/pen/mKNqYm Mustafa Genç

See the Code - See it Full Page - See Details

Many folks use these, and their merits can be argued, but for practical purposes, the "Hamburger" icon has familiarity going for it, at the very least. These animations add a little more transparency to what it means from a UI perspective by transforming it into another recognizable icon - the closing "x". Full walkthrough here: http://designcouch.com/home/why/2014/06/23/playing-with-hamburger-icon-animations/

]]>
Menu "Hamburger" Icon Animations 2018-07-07T23:31:34-07:00
Completely CSS: Custom checkboxes, radio buttons and select boxes https://codepen.io/mustafagenc/pen/jxjPKE https://codepen.io/mustafagenc/pen/jxjPKE Mustafa Genç

See the Code - See it Full Page - See Details

CodePen demo for: http://kyusuf.com/post/completely-css-custom-checkbox-radio-buttons-and-select-boxes

]]>
Completely CSS: Custom checkboxes, radio buttons and select boxes 2018-05-24T19:45:28-07:00
Become Brilliant https://codepen.io/mustafagenc/pen/RyeWjq https://codepen.io/mustafagenc/pen/RyeWjq Mustafa Genç

See the Code - See it Full Page - See Details

A beautiful and stylish pricing plans which designed by Wouter de Bres and developed in pure-CSS with a simple transition.

]]>
Become Brilliant 2018-05-16T12:08:46-07:00