Download and Instructions use Certified Professional Speaker

Download and user instructions

From now on, you can proudly use the Speakers Club Certified Badge on your own promotional channels and resources.

Especially for you, we have set up this handy page so you can download the right Badge(s) here.

File types and formats

SVG

SVG stands for Scalable Vector Graphics. It is a vector file type very suitable for the web.

Download SVGs >

PNG

PNG stands for Portable Network Graphic and is a raster file type for images that supports transparent and semi-transparent background.

Download PNGs (128px) >

Download PNGs (256px) >

Download PNGs (512px) >

JPG

Jpg stands for 'Joint Photographic Experts Group'. This format is ideally suited for photographic material with many colours. Does not support transparent backgrounds.

Download JPGs >

EPS

EPS is a vector file type often used for professional and high-quality image printing.

Download EPSs >

Legend

Download all file types >

Instructions

Preferences
The preferred badge is the one with file name 'SC-CB-PS-FC-LightBG'. It can be used on white or very light backgrounds.

Alternative options are:

SC-CB-PS-FC-LightShade-LightBG
SC-CB-PS-FC-Dark-LightBG
SC-CB-PS-FC-DarkShade-LightBG
SC-CB-PS-FC-Contour-Black-LightBG

How to use the badge on dark backgrounds?

For use on dark backgrounds or for placing over images, the variants 'SC-CB-PS-FC-Light-DarkBG' or 'SC-CB-PS-FC-Contour-White-DarkBG' be used.

HTML

				
					<div id="keurmerktlap">
  <a href="https://www.speakersclub.nl/en/specialisms/talk-like-a-pro-gramme/" target="_blank"><img decoding="async" src="https://www.speakersclub.nl/wp-content/uploads/2022/07/CertifiedBadge-OpWit.png"></a>
</div>

CSS

				
					#keurmerktlap {
position: absolute;
top: 0;
left: 0;
overflow: hidden;
text-align:centre;
}
#keurmerktlap img {
width:100%;
}
#keurmerktlap:before {
content: ''
position: absolute;
top: 0;
left: -100px;
width: 70px;
height: 90%;
background: rgba(255,255,255, 0.3);
transform: skewX(-30deg);
animation-name: slide;
animation-duration: 7s;
animation-timing-function: ease-in-out;
animation-delay: .3s;
animation-iteration-count: infinite;
animation-direction: alternate;
background: linear-gradient(
    to right,
    rgba(255, 255, 255, 0.13) 0%,
    rgba(255, 255, 255, 0.13) 77%,
    rgba(255, 255, 255, 0.5) 92%,
    rgba(255, 255, 255, 0.0) 100%
  );
}
@keyframes slide {
  0% {
    left: -100;
    top: 0;
  }
  50% {
    left: 120px;
    top: 0px;
  }
  100% {
    left: 290px;
    top: 0;
  }
}</xmp