CSS Examples / Frontend Components : CSS Mix

Rotating Rounded Triangles Animation

15.02.2019

Rotating rounded triangles animation. Rounded triangles black and white. Pug. SCSS. Animation degrees.

Made with: HTML (Pug),CSS (SCSS)

View Code

Svg Section Dividers

14.02.2019

SVG section dividers, embedded with data-uri & colored with SASS.

Made with: HTML (Slim),CSS (SCSS)

View Code

Card Effect

14.02.2019

Hover effect for card in HTML and CSS.

Made with: HTML,CSS

View Code

Creative Hamburger Menu

14.02.2019

Hamburger menu using the new clip-path CSS property.

Made with: HTML (Pug),CSS (SCSS),JS

View Code

Bootstrap Pagination Style 106

13.02.2019

Made with: HTML,CSS

View Code

Bootstrap 4 Horizontal Timeline

13.02.2019

Made with: HTML,CSS,JS

View Code

Unit Testing Results Panel

13.02.2019

Made with: HTML (Pug),CSS (SCSS),JS

View Code

Border Radius Blob

13.02.2019

Made with: HTML,CSS (SCSS)

View Code

Adaptive Tooltips

13.02.2019

HTML and CSS adaptive tooltips.

Made with: HTML,CSS (Sass)

View Code

Stacked Flexible Slides Layout

12.02.2019

This example illustrates how to create layout of slides stacked on each other (especially useful for fade in/out transitions). It's achieved without setting their height and avoiding position: absolute; so they are fully flexible and easy to keep in normal page flow.

Made with: HTML,CSS

View Code

Header / About Page

12.02.2019

A simple header.

Made with: HTML,CSS (SCSS)

View Code

Night On The Mountain

12.02.2019

Text that emerges into a scenic photo with parallax scrolling. This time in CSS (clip-path) rather than in SVG (clipPath) and with scaling, fading, and more drama.

Made with: HTML,CSS,JS

View Code