Card

Cards are flexible surfaces used to group information in a small layout. They give small previews of information or provide secondary content in relation to the content it's near. Several cards can be used together to group related information.

Text/Shadow cards

To obtain this result, use div tag with combination of card-container, card-content, card-header, card-subhead, card-header-tag and card-body class names. For shadow card add additional class name as card-shadow.

APS-C Camera Nikon

by Camera Jabber

A little gem of a camera with some powerful features

APS-C Camera Nikon

by Camera Jabber

A little gem of a camera with some powerful features

Vertical/Horizontal cards

To obtain this result, use div tag with combination of card-container, card-content, card-header, card-subhead, card-header-tag, card-body, card-footer, card-footer-btns and card-footer-links class names. For horizontal card add additional class name as card-horizontal.

camera_image

APS-C Camera Nikon

by Camera Jabber

A little gem of a camera with some powerful features

camera_image

APS-C Camera Nikon

by Camera Jabber

Overlay Text card

To obtain this result, use div tag with combination of card-container, card-content, card-header, card-subhead, card-header-tag, card-body, card-footer, card-footer-btns and card-footer-links class names. For overlay card add additional class name as card-overlap.

camera_image

APS-C Camera Nikon

by Camera Jabber

A little gem of a camera with some powerful features

Badge card

To obtain this result, use div tag with combination of card-container, card-content, card-header, card-subhead, card-header-tag, card-body, card-footer, card-footer-btns and card-footer-links class names. For badge card add additional class name as card-badge and card-badge-item.

New
camera_image

APS-C Camera Nikon

by Camera Jabber

A little gem of a camera with some powerful features

Dismiss card

To obtain this result, use div tag with combination of card-container, card-content, card-header, card-subhead, card-header-tag card-body, card-footer, card-footer-btns and card-footer-links class names. For badge card add additional class name as card-dismiss and use button tag with dismiss-btn and dismiss-btn-icon class name.

camera_image

APS-C Camera Nikon

by Camera Jabber

A little gem of a camera with some powerful features

eCommerce Card

To obtain this result, use div tag with combination of card-content, card-header, card-subhead, card-header-tag, card-body and card-footer class names. Use ecomm-card for vertical card, ecomm-card-horz for horizontal card and ecomm-overlay for overlay card.

camera_image

APPLE iPhone 12 (Black, 64 GB)

1,58,616 Ratings & 10,880 Reviews
3.8
₹60,199 ₹65,900 8% off
OUT OF STOCK
camera_image

APPLE iPhone 12 (Black, 64 GB)

1,58,616 Ratings & 10,880 Reviews
3.8
₹60,199 ₹65,900 8% off
camera_image

APPLE iPhone 12 (Black, 64 GB)

1,58,616 Ratings & 10,880 Reviews
3.8
₹60,199 ₹65,900 8% off

Social Media card

To obtain this result, use div tag with combination of card-container, card-content, card-header, card-header, card-subhead, card-body, card-footer, card-footer-btns and card-footer-links class names. Use social-card class for Social media card.

camera_image

A little gem of a camera with some powerful features

A little gem of a camera with some powerful features