![Article News Card](https://img.cssmix.net/img/2022/9/6222_article-news-card.webp)
Hexagon Shapes
An example of how clipping paths can create beautiful geometric shapes. Part of a demo for a Smashing Magazine article published in May 2015 titled "Creating Responsive Shapes With Clip-Path And Breaking Out Of The Box".
Made with: HTML,CSS
![Hexagon Shapes](https://img.cssmix.net/img/2022/7/hexagon-shapes_3191.webp)
Css Unicode Star Rating
No Javascript, no images, no icon fonts.
Made with: HTML,CSS (SCSS)
![Css Unicode Star Rating](https://img.cssmix.net/img/2022/7/css-unicode-star-rating_4609.webp)
Pure Css Animation On Single Letter, Slide & Bounce
Pure CSS animation, using @keyframes and SCSS cycles (@for). Black & white using text-shadow and using text-stroke. No JS.
Made with: HTML,CSS (SCSS)
![Pure Css Animation On Single Letter, Slide & Bounce](https://img.cssmix.net/img/2022/7/pure-css-animation-on-single-letter,-slide-&-bounce_4907.webp)
Mighty Fish
WebGL experiment using ThreeJs. Move your mouse right and left, top and bottom to change speed and direction.
Made with: HTML,CSS,JavaScript
![Mighty Fish](https://img.cssmix.net/img/2022/7/mighty-fish_6723.webp)
Sidebar Menu Concept
Sidebar menu that pushes content aside in 3D space. Still prettifying things.
Made with: HTML,CSS (SCSS),JS
![Sidebar Menu Concept](https://img.cssmix.net/img/2022/8/6559_sidebar-menu-concept.webp)
Css-Only Star Rating
The goal was to create a radio button-powered star rating widget that uses CSS only.
Made with: HTML,CSS (SCSS)
![Css-Only Star Rating](https://img.cssmix.net/img/2022/9/4610_css-only-star-rating.webp)
![Slide Tab Bar](https://img.cssmix.net/img/2022/7/slide-tab-bar_4679.webp)
Sticky Table Headers By Position: Sticky;
Trying out to make a sweet table with sticky table headers if their table is in the viewport (like the iOS names list names beginning capital letter).
Made with: HTML,CSS
![Sticky Table Headers By Position: Sticky;](https://img.cssmix.net/img/2022/9/4686_sticky-table-headers-by-position-sticky.webp)
![Slide Horizontal Menu](https://img.cssmix.net/img/2022/7/slide-horizontal-menu_3220.webp)
![Html Css 404 Page Templates](https://img.cssmix.net/img/2022/7/html-css-404-page-templates_5351.webp)
![Animated Css3 Buttons](https://img.cssmix.net/img/2022/7/animated-css3-buttons_2712.webp)
Svg Animation 404 Page
SVG Animation to create an error page 404. Use the library SnapSVG.
Made with: HTML,CSS,JavaScript
![Svg Animation 404 Page](https://img.cssmix.net/img/2022/7/svg-animation-404-page_5531.webp)
Animated Submit Button
A simple animated Submit button using CSS, JS and jQuery.
Made with: HTML,CSS,JS
![Animated Submit Button](https://img.cssmix.net/img/2022/9/6165_animated-submit-button.webp)
![Animated Css3 Buttons](https://img.cssmix.net/img/2022/7/animated-css3-buttons_1935.webp)
![React Native Progress Bar](https://img.cssmix.net/img/2022/7/react-native-progress-bar_6621.webp)
Download Buttons
CSS download buttons with pretty hover effects.
Made with: HTML,CSS (SCSS)
![Download Buttons](https://img.cssmix.net/img/2022/7/download-buttons_2613.webp)
Material More Button Css
More info button with Material Design style. Used input:checked and a checkbox to build this, then used a tags to protect the click from unchecking the checkbox.
Made with: HTML,CSS
![Material More Button Css](https://img.cssmix.net/img/2022/9/2600_material-more-button-css.webp)
Svg Memory Game
Tiles are SVG which morph into icons using Snap.js.
Made with: HTML,CSS (Less),JS
![Svg Memory Game](https://img.cssmix.net/img/2022/7/svg-memory-game_5810.webp)