In this guide, we will show you how to add an “Image Card widget” to your Elementor website. The Image Card widget makes it easy to showcase services, products, or promotional items with a stylish card layout that includes an image, title, description, and call-to-action button. Perfect for creating clean, visually appealing designs that support fast web development, this versatile and free widget allows you to customize each element effortlessly while maintaining a modern, cohesive look on your site.
Let’s explore the customization options available in the “Image Card widget” for Elementor below.
Elementor Free Image Card Tutorial Video
Add a Free Image Card to Elementor
Add a Free Image Card Widget to an Elementor Page
Elementor Image Card Widget General Settings
Image
Upload or select the main image for the card.
Title
Enter the text for the card title.
Content
Add the main descriptive text using a rich text editor with standard formatting tools.
Button Text
Enter the text for the button on the image card.
Link
Sets the URL the button (or image/card if linkable) will navigate to.
Image Linkable
Makes the image itself clickable and linked to the specified URL.
Alignment
Controls horizontal alignment of the content inside the card.
Left
Center
Right
Elementor Image Card Widget Style Settings
Background Color
Sets the background color of the image card.
Show Box Shadow
Toggles a shadow effect around the card.
Content Minimum Height
Sets the minimum height for the content area inside the card.
Box Padding
Sets the inner spacing between the card’s content and edges (Top, Right, Bottom, Left).
Content Padding
Sets inner spacing specifically for the content area.
Title Spacing
Controls vertical space below the title.
Text Spacing
Controls vertical space below the main text.
Border Type
Defines the style of the card’s border.
Default
None
Solid
Double
Dotted
Dashed
Groove
Box Border Radius
Controls the roundness of the card’s corners.
Button Spacing
Controls the space around the button.
Button Radius
Controls the roundness of the button's corners.
Button Padding
Sets inner spacing between the button's text and edges (Top, Right, Bottom, Left).
Button Background
Sets the button’s background color (normal state).
Button Background Hover
Sets the button’s background color when hovered.
Button Color
Sets the button text color (normal state).
Button Color Hover
Sets the button text color when hovered.
Button Border Color
Sets the button border color (normal state).
Button Border Color Hover
Sets the button border color when hovered.
Button Border Width
Controls the thickness of the button border.
Button Border Style
Defines the border style around the button.
Solid
Dashed
Dotted
Button Animation
Selects an animation effect for the button.
Not Chosen
Grow
Shrink
Pulse
Pulse Grow
Pulse Shrink
Push
Pop
Bounce In
Bounce Out
Rotate
Grow Rotate
Float
Sink
Bob
Hang
Skew
Skew Forward
Skew Backward
Wobble Vertical
Wobble Horizontal
Wobble To Bottom Right
Wobble To Top Right
Wobble Top
Wobble Bottom
Wobble Skew
Buzz
Buzz Out
Enable Styles
Turns custom title styling on or off; activates other style settings when enabled.
Typography
Adjusts the font family, size, weight, line height, letter spacing, and text transform for the title.
Color
Sets the color of the title text.
Custom Styles
Allows you to add custom CSS for advanced title styling.
Enable Styles
Turns custom text styling ON/OFF.
Typography
Controls font family, size, weight, letter spacing, etc., for the button text.
Color
Sets the color of the button text. Can be linked to global colors.
Custom Styles
Allows you to add advanced, custom CSS code for unique text effects.
Image Card Widget Design Examples For Elementor
Here are some live use cases for the Image Card widget.
Image Card Content Box with team section.
Image Card Content Box with menu.
Thank you for using the Image Card widget for Elementor! This versatile tool lets you display an image along with a title, description, and call-to-action button in a stylish card layout, boosting the clarity and appeal of your content. Wrapped with a subtle shadow and perfectly spaced elements, it supports clean, modern web design and helps you showcase services, products, or promotions effortlessly. For questions or inspiration, feel free to reach out or explore our demo.