Review Card

A guest review card displaying an avatar with initials, author name, date, star rating, and review text.

Preview

Arjun Mehta

March 2026

Best hostel experience ever! The mountain views from the rooftop cafe are breathtaking. The staff was super friendly and the bonfire nights were unforgettable.

Priya Sharma

February 2026

Great location and amazing vibes. The dorms are clean and comfortable. Would definitely recommend for solo travellers.

Usage

tsx

import { ReviewCard } from "zostel-ui";

<ReviewCard
  author="Arjun Kumar"
  initials="AK"
  date="Jan 2026"
  rating={5}
  review="Amazing hostel with breathtaking views..."
/>

Props

Prop	Type	Default	Description
`author`	`string`	—	Name of the review author
`initials`	`string`	—	Initials to display in the avatar circle
`avatarUrl`	`string`	—	Optional avatar image URL (overrides initials)
`date`	`string`	—	Display date of the review
`rating`	`number`	—	Star rating value (1-5)
`review`	`string`	—	Review text content
`className`	`string`	—	Additional CSS classes

author

Type: string

Default: —

Name of the review author

initials

Type: string

Default: —

Initials to display in the avatar circle

avatarUrl

Type: string

Default: —

Optional avatar image URL (overrides initials)

date

Type: string

Default: —

Display date of the review

rating

Type: number

Default: —

Star rating value (1-5)

review

Type: string

Default: —

Review text content

className

Type: string

Default: —

Additional CSS classes

Previous Room Type Card Next Price Tag