# Rating proof card > One outside rating with its figure, source and date, linked to the live vendor profile. - Block class: `.hs-rating` - CSS: `components/rating.css` (also inside https://brand.honorsociety.org/brand.css) - JS: none - Status: built, open to change - Decision record: https://brand.honorsociety.org/decisions/components-round-3.html - Variants: BBB, Trustpilot, TrustedSite - HTML page: https://brand.honorsociety.org/components/rating/ ## What it is One outside rating with its source and date. Built: A, figure first ([round 3](/decisions/components-round-3/)). Figures from site facts only; links go to the live vendor profile. No vendor marks redrawn, no `AggregateRating` schema. ## When to use - The proof band on `/legitimacy`, `/reviews` and `/scam`. - Two to four outside ratings side by side: BBB, Trustpilot, TrustedSite. ## When not to use - A figure of our own, such as members or money given: use the [Stat](/components/stat/). - A member testimonial: use the [Quote](/components/quote/). - The compact trust line under a page head: use the fixed one-line trust string from house style. ## Rules - Compose it on a card: `class="hs-card hs-rating"`. Put two to four in `.hs-card-grid`; add `--3` for three. Load `rating.css` after `card.css`. - Keep this order: `.hs-rating__source`, `.hs-rating__score` (figure and scale), `.hs-rating__basis`, `.hs-rating__date`, `.hs-rating__foot`. - Take every figure from site facts. Trustpilot always carries its “As of” month; BBB carries “Since 2014”. A status with no score has no date line. - Link to the live vendor profile with `.hs-rating__link`, plus `data-ph-capture-attribute-cta` and `data-ph-capture-attribute-cta-loc`. Keep the link quiet: no gold. - Write “A+ BBB Rating”, never “BBB Approved” or “BBB Certified”. - Never redraw a vendor mark. Add no `AggregateRating` schema. ## Accessibility - The figure is text, so a screen reader reads the score with its scale. - Contrast: figure navy 12.4:1; basis ink 13.0:1; scale and date slate 6.2:1 (5.9:1 on soft). - The link names its destination (“View the BBB profile”). Hover turns its underline navy. - Reduced motion: the link transition is removed. ## Variants ### BBB, Trustpilot, TrustedSite Trustpilot always carries its “as of” month. A status with no score (TrustedSite) has no date line. The link is quiet: a row of gold underlines breaks one gold per viewport. ```html ```