CreditRatingBadge

stable

Credit rating badge with agency, tier color coding (IG=green/sub-IG=caution/distressed=red), and outlook

Finance/Storybook ↗

import { CreditRatingBadge } from "@nodus/design-system/finance"

Loading demo…

Props

Prop	Type	Default	Description
`rating`req	`string`	—	Rating symbol (e.g. Aaa, AAA, BBB+, Ba2, CCC-)
`agency`req	`RatingAgency`	—	moodys \| sp \| fitch \| kbra \| dbrs
`outlook`	`RatingOutlook`	—	positive \| stable \| negative \| developing \| watch_positive \| watch_negative
`variant`	`string`	—	badge (inline) \| card (detail panel)
`issuerName`	`string`	—	Issuer or instrument name (card variant)

ratingrequired

Type stringDefault —

Rating symbol (e.g. Aaa, AAA, BBB+, Ba2, CCC-)

agencyrequired

Type RatingAgencyDefault —

moodys | sp | fitch | kbra | dbrs

outlook

Type RatingOutlookDefault —

positive | stable | negative | developing | watch_positive | watch_negative

variant

Type stringDefault —

badge (inline) | card (detail panel)

issuerName

Type stringDefault —

Issuer or instrument name (card variant)

Metadatasemantic type outcome space

MobileWorks As-Is

Design Rationale

This component was designed to express:

View all principles →

Explore Related

KYCStatusCard→

KYC/CDD status card with risk tier, expiry date, and outstanding document checklist

StressTestResults→

Stress test scenario results table with impact bars, pass/warn/fail status, and worst-case callout

Was this helpful?