Close

Pricing table with hover animations

This is an example of a pricing table with hover animations, designed using HTML, CSS, and Bootstrap framework 4. The font styles are imported to the code with its URL. The form consists of three price plans on three tables. Media quarries have been used to increase the responsiveness of the form. The body of the form is given a font family of 'Roboto', sans-serif, and height as 650px. The background color of the form is set to a linear gradient color of (to top right, #353749 0%, #F7A0D9 100%). The card container is given the styles of width as 70%, height as 500px, background color as linear-gradient(to bottom left, #33ccff 0%, #009933 100%), border-radius as 10px, and box-shadow as 0 0 35px brown. The price tables are given three different linear-gradient background colors. The price cards take a transform effect of scale(1.2, 1.2), and box-shadow effect of 0 0 35px black, in a hover event to implement the animations. The cursor style for the buttons is set as pointer to get the hand cursor effect. Source: https://bbbootstrap.com/snippets/our-pricing-table-80836256

Post Comment or Questions

Lorem ut labore et dolore magna aliqua. Ut enim ad minim veniam.

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.

Several Related Snippets

Lorem ut labore et dolore magna aliqua. Ut enim ad minim veniam.