How can I remove text from one side of a flippable card?

Topic summary

A user is rebuilding their site with a new theme featuring flippable cards and wants to remove text from the front of these cards.

Proposed Solutions:

  • Set the front text to not display, then show it only on hover or focus
  • Verify whether the text is part of the actual images (requiring image edits) or a theme element

Resolution:
After the user shared their store preview URL, a CSS solution was provided:

  • Add specific CSS code to hide the text element
  • Location: Online Store > Themes > Edit code > Assets > custom CSS file
  • Target class: .icon-content-center { display: none; }

The discussion appears resolved with a concrete CSS implementation provided.

Summarized with AI on November 13. AI used: claude-sonnet-4-5-20250929.

Hey guys,

I am rebuilding my site with a new theme and these images have these flippable cards, Im wondering how I can remove the text on the front of the card,

thank you please let me know

Just set the text to not display , then only display it when the card is focused or hovered.

Unless of course the “text” is actual part of the images themselves in which case you need to fix the images not the theme.

Hi,

Can you share your store url

https://3uvuokjj9vljv3hj-55529865515.shopifypreview.com

Hi,

Add this CSS code
Online Store > Themes > Edit code > Assets > custom.css or theme.css

.icon-content-center { display: none; }