Infographic CDS

VIEWPORTS Full Width 1366px 1024px 768px 480px 320px

CDS Implied Credit
Scores at a glance

CDS Spreads

Recovery rate*

CDS Probability
of Defaults

Agency LTR
Rating

Calibration

Spot score

We provide a spot score which is an unfiltered view of the CDS market for a particular entity, on a specific day.

Smoothed score

We also provide a smoothed score, based on an exponentially weighted moving average over 250 days which reduces the impact of market volatility and is more useful for portfolio analysis.

*Varies country to country, which makes like-for-like global comparisons impossible.

More than just scores

In addition to the spot and smoothed scores, you’ll have access to other helpful data points, deltas and benchmarks.

1800 Global Entities

CDS Implied Credit Scores

Probability Of Default

CDS Benchmarks

Historic Data since 2007

CDS Spreads

Deltas

Code

HTML CSS SCSS 
<section id="infographics-cds" class="section section--spacing-above section--spacing-below">
	
	<div>
		<div class="wrapper--1">
			<h2 class="heading--1">
				CDS Implied Credit <br>Scores at a glance
			</h2>
			
			<div class="section__overflow" style="position: relative">
				<div class="infographics__wrapper">
					<div class="infographics__column infographics__column--1">
						<div class="icon-teaser">
							<div class="icon">
								<img alt="" height="84" src="https://fitchsolutions.com/sites/default/files/styles/thumbnail/public/2020-09/global-crir.png" width="84">
							</div>
	
							<h3 class="heading--6">
								<strong>CDS Spreads</strong>
							</h3>
						</div>
	
						<div class="infographics--subtract">
							<img alt="" height="5" src="https://fitchsolutions.com/sites/default/files/styles/medium/public/2021-04/flowline-subtract.png" width="35">
						</div>
	
						<div class="icon-teaser">
							<div class="icon">
								<img alt="" height="84" src="https://fitchsolutions.com/sites/default/files/2021-03/Forecasting.png" width="84">
							</div>
	
							<h3 class="heading--6">
								<strong>Recovery rate*</strong>
							</h3>
						</div>
					</div>
	
					<div class="infographics__column infographics__column--2">
						<div class="infographics__lines">
							<img alt="" height="285" src="https://fitchsolutions.com/sites/default/files/styles/medium/public/2021-03/flowline-left-arrow.png" width="85">
						</div>
					</div>
				
					<div class="infographics__mid-section">

						<div class="flex">
							<div class="infographics__column infographics__column--3">
								<div>
									<div class="icon-teaser">
										<div class="icon">
											<img alt="" height="84" src="https://fitchsolutions.com/sites/default/files/styles/medium/public/2021-03/Report%2B2.png" width="84">
										</div>
			
										<h3 class="heading--6">
											<strong>CDS Probability <br>of Defaults</strong>
										</h3>
										
									</div>
								</div>
							</div>

							<div class="infographics__column infographics__column--4">
								<div class="infographics__lines infographics__lines--equal">
									<img alt="" height="17" src="https://fitchsolutions.com/sites/default/files/2021-04/flowline-equal.png" width="35">
								</div>
							</div>

							<div class="infographics__column infographics__column--5">
								<div class="icon-teaser">
									<div class="icon">
										<img alt="" height="84" src="https://fitchsolutions.com/sites/default/files/styles/medium/public/2021-03/Clear-Career-Paths.png" width="84">
									</div>
			
									<h3 class="heading--6">
										<strong>Agency LTR <br>Rating</strong>
									</h3>
								</div>
							</div>
						</div>

						<div>
							<img alt="" height="53" src="https://fitchsolutions.com/sites/default/files/styles/medium/public/2021-05/flowline-middle-4.png" width="320">
						</div>

						<div>
							<h3 class="heading--6">
								<strong>Calibration</strong>
							</h3>
						</div>

					</div>

	
					<div class="infographics__column infographics__column--6">
						<div class="infographics__lines">
							<img alt="" height="165" src="https://fitchsolutions.com/sites/default/files/2021-03/flowline-right.png" width="146">
						</div>
					</div>
	
					<div class="infographics__column infographics__column--7">
						<div class="icon-teaser">
							<div class="icon">
								<img alt="" height="84" src="https://fitchsolutions.com/sites/default/files/styles/medium/public/2021-03/Diagnostic-Practice-Questions.png" width="84">
							</div>
	
							<h3 class="heading--6">
								<strong>Spot score</strong>
							</h3>
	
							<p>
								We provide a spot score which is an unfiltered view of the CDS market for a particular
								entity, on a specific day.
							</p>
						</div>
	
						<div class="icon-teaser">
							<div class="icon">
								<img alt="" height="84" src=
								"https://fitchsolutions.com/sites/default/files/styles/medium/public/2021-03/Credit-Analysis-Solutions.png" width=
								"84">
							</div>
	
							<h3 class="heading--6">
								<strong>Smoothed score</strong>
							</h3>
	
							<p>
								We also provide a smoothed score, based on an exponentially weighted moving average over 250
								days which reduces the impact of market volatility and is more useful for portfolio
								analysis.
							</p>
						</div>
					</div>
				</div>

				<sub>*Varies country to country, which makes like-for-like global comparisons impossible.</sub>
			</div>
			
		</div>
	</div>

</section>

<section class="section section--spacing-above section--spacing-below">

	<div class="section--padding-1" style="background-color: #2d374e; color: #ffffff;">
		<div class="wrapper--1">
			<div class="grid__wrapper grid--as-middle ta--1">
				<div class="grid grid--full grid--se-1-4">
					<h2 class="heading--3">
						More than just scores
					</h2>

					<p>
						In addition to the spot and smoothed scores, you’ll have access to 
						other helpful data points, deltas and benchmarks.
					</p>
				</div>

				<div class="grid grid--full grid--se-5-13">
					<div class="wrapper--1">
						<div class="grid__wrapper grid--column-7 grid--row-1">
							<div class="grid grid--se-1-2 grid--as-top ta--middle">
								<div class="grid__content">
									<div class="icon-teaser icon-text">
										<div class="icon">
											<img alt="" height="84" src=
											"https://fitchsolutions.com/sites/default/files/styles/thumbnail/public/2020-09/global-crir.png" width="84">
										</div>

										<p>
											1800 Global Entities
										</p>
									</div>
								</div>
							</div>

							<div class="grid grid--se-2-3 grid--as-top ta--middle">
								<div class="grid__content">
									<div class="icon-teaser icon-text">
										<div class="icon">
											<img alt="" height="84" src=
											"https://fitchsolutions.com/sites/default/files/styles/medium/public/2021-03/Report%2B2.png" width="84">
										</div>

										<p>
											CDS Implied Credit Scores
										</p>
									</div>
								</div>
							</div>

							<div class="grid grid--se-3-4 grid--as-top ta--middle">
								<div class="grid__content">
									<div class="icon-teaser icon-text">
										<div class="icon">
											<img alt="" height="84" src=
											"https://fitchsolutions.com/sites/default/files/styles/medium/public/2021-03/Credit-Analysis-Solutions.png" width=
											"84">
										</div>

										<p>
											Probability Of Default
										</p>
									</div>
								</div>
							</div>

							<div class="grid grid--se-4-5 grid--as-top ta--middle">
								<div class="grid__content">
									<div class="icon-teaser icon-text">
										<div class="icon">
											<img alt="" height="84" src=
											"https://fitchsolutions.com/sites/default/files/styles/medium/public/2021-03/Diagnostic-Practice-Questions.png"
											width="84">
										</div>

										<p>
											CDS Benchmarks
										</p>
									</div>
								</div>
							</div>

							<div class="grid grid--se-5-6 grid--as-top ta--middle">
								<div class="grid__content">
									<div class="icon-teaser icon-text">
										<div class="icon">
											<img alt="" height="84" src=
											"https://fitchsolutions.com/sites/default/files/styles/medium/public/2021-03/Calendar-Month.png" width="84">
										</div>

										<p>
											Historic Data since 2007
										</p>
									</div>
								</div>
							</div>

							<div class="grid grid--se-6-7 grid--as-top ta--middle">
								<div class="grid__content">
									<div class="icon-teaser icon-text">
										<div class="icon">
											<img alt="" height="84" src="https://fitchsolutions.com/sites/default/files/2021-03/Forecasting.png" width="84">
										</div>

										<p>
											CDS Spreads
										</p>
									</div>
								</div>
							</div>

							<div class="grid grid--se-7-8 grid--as-top ta--middle">
								<div class="grid__content">
									<div class="icon-teaser icon-text">
										<div class="icon">
											<img alt="" height="84" src=
											"https://fitchsolutions.com/sites/default/files/styles/medium/public/2021-03/Leveraged%2BFinance%2BSolution.png"
											width="84">
										</div>

										<p>
											Deltas
										</p>
									</div>
								</div>
							</div>
						</div>
					</div>
				</div>
			</div>
		</div>
	</div>
	
</section>

 

#infographics-cds h3.heading--6 {
  text-transform: none;
}

#infographics-cds sub {
  padding: 0 1.2rem;
}

.infographics__wrapper {
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  padding: 0 1.2rem;
}

.infographics__column--1, .infographics__column--7 {
  min-height: 58rem;
}

.infographics__column--1, .infographics__column--2 {
  min-width: 13.4rem;
}

.infographics__column--2 {
  padding-top: 1.2rem;
}

.infographics__column--4, .infographics__column--6 {
  width: auto;
  height: auto;
}

.infographics__column--3, .infographics__column--5 {
  min-width: 24rem;
  height: 17rem;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-justify-content: space-evenly;
      -ms-flex-pack: space-evenly;
          justify-content: space-evenly;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
}

.infographics__column--7 {
  width: 26rem;
  /* iPad Pro Portrait - iPad Landscape */
}

@media only screen and (max-width: 1024px) {
  .infographics__column--7 {
    min-width: 22rem;
  }
}

.infographics__column--7 .icon-teaser:not(.icon-teaser:last-child) {
  padding-bottom: 1.7rem;
}

.infographics__mid-section {
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-direction: column;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
  place-content: center;
  width: 58rem;
  /* iPhone 6 onwards */
}

@media only screen and (max-width: 480px) {
  .infographics__mid-section {
    width: 50rem;
  }
}

.infographics__mid-section .flex {
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
}

.infographics__lines {
  margin: 0 2.4rem;
  padding: 0;
  line-height: 0;
}

.infographics__lines--equal {
  padding-top: 9rem;
}

.infographics--subtract {
  padding-bottom: 0.5rem;
  padding-left: 3.1rem;
}

[class*="infographics__column"]:not(.infographics__column--3):not(.infographics__column--5) {
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-direction: column;
      -ms-flex-direction: column;
          flex-direction: column;
  place-content: space-evenly;
}

.icon-text {
  font-size: 1.4rem;
}

 

#infographics-cds h3.heading--6 {
    text-transform: none;
}

#infographics-cds sub {
    padding: 0 1.2rem;
}


.infographics {
    &__wrapper {
        display: flex; 
        padding: 0 1.2rem;
    }

    &__column {
        &--1,
        &--7 {
            min-height: 58rem;
        }
        &--1,
        &--2 {
            min-width: 13.4rem;
        }

        &--2 {
            padding-top: 1.2rem;
        }

        &--4,
        &--6 {
            width: auto;
            height: auto;
        }  

        &--3,
        &--5 {
            min-width: 24rem; 
            height: 17rem;
            display: flex;
            justify-content: space-evenly;
            align-items: center;
        }

        &--7 {
            width: 26rem;

            @include mq-2 {
                min-width: 22rem;
            }

            & .icon-teaser:not(.icon-teaser:last-child) {
                padding-bottom: 1.7rem;
            }
        }   
    }

    &__mid-section {
        // border: 0.5px #c0c0c0 solid;
        display: flex;
        flex-direction: column;
        align-items: center;
        place-content: center;
        width: 58rem;

        @include mq-4 {
            width: 50rem;
        }

        & .flex {
            display: flex;
        }
    }
    
    &__lines {
        margin: 0 2.4rem;
        padding: 0;
        line-height: 0;

        &--equal {
            padding-top: 9rem;
        }
    }

    &--subtract {
        padding-bottom: 0.5rem;
        padding-left: 3.1rem;
    }

}

[class*="infographics__column"]:not(.infographics__column--3, .infographics__column--5) {
    display: flex;
    flex-direction: column;
    place-content: space-evenly;
}

.icon {
    &-text {
        font-size: 1.4rem;
    }
}

 

Design Files

Figma

Component Options

Component Options

There are no options for this component.

Component
Infographic
Copyright © 2024 GAMEWORK | Nicholas Game
How To
Upgrading to Drupal 10
Velocity for Marketo
jQuery: The Basics
Homebrew
Gulp
Making the Grade
Formatting SVG Logos for the Website
Marketo Landing Page Builder
Work with our submodules
Drush Launcher
Upgrade PHP and change PATH
Qualtrics
Bitbucket SSH Key
Git
VS code extensions
Guide
Profile Banner
Fitch Ratings - Analyst Listing Page
CSS Custom Properties (Variables)
Carousel - Waterwheel
Mix it Up
Brand Navigation
Top Bar
Fitch Ratings - Podcast
Fitch Ratings - Analyst Profile
Event
Long Read
Article
Code test
Search Demo
Profile - Sustainable Fitch
Search Icon
Login
Language Filter
Theme Switch
Flip Card
Overlay
Infographic CDS
Interactive Map
Iframe
Footer
Main
Header
Accordion
Wrappers
Podcasts
DOM Layout
Figure
Search Tools
Search Bar
Search Overlay
Ratings Process
Ratings Definitions
Language Switch
Video Teaser
Video Player
Video Banner
Profile Teaser
Event Teaser
Back to Top
Pager
Navigation - Dropdown
Navigation - Overlay
Profile - Leadership FR
Profile - Leadership FG V2
Leadership Overview - FG
Forms
Leveraged Finance
Tags
Profile - Leadership FG V1
Profile - Analyst
Banner V2
Promo Hightlight
Tables
History - Fitch Group
Insights
Event Teaser
Event Listing
Overview
Logos
Title
Video
Text
Tab Wrapper
Tab
Sub Title
Section More
Showcase
Section
Quote
Promo Box
Post
Page Teaser
Page Promo
Page Layout - Left or Right Column with Main Column
Number
Node Reference
Map
Key Point
Key Highlight
Image
Icon Teaser
Highlight
Grid Column Wrapper
Grid Column
From library
Figure
Column Wrapper
Column
Carousel Slide
Carousel
Card
Call to action
Box
Block Reference
Banner
Email Guide
View Online
Email Components
Fitch Group
Fitch Ratings
Fitch Solutions