Cards

[Jose-Maria-Martins]

are you guys thinking of posting components with images?

[its-monotype]

Would be great to have some examples of cards with images for example product card

[Jose-Maria-Martins]

Exactly! People love using cards with images, especially ecommerce and ranking websites.

[mcgri]

For anyone looking for it:

const CardImage = React.forwardRef<
  HTMLImageElement,
  React.ImgHTMLAttributes<HTMLImageElement>
>(({ className, ...props }, ref) => (
  <img ref={ref} className={cn("h-auto w-full", className)} {...props} />
));
CardImage.displayName = "CardImage";

Just add it into the card.tsx and use above CardHeader in the card. Also, I am adding "overflow-hidden" to my <Card>

[biapar]

Full example?

[shadcn]

This issue has been automatically closed because it received no activity for a while. If you think it was closed by accident, please leave a comment. Thank you.