Video player (vi20)
Our vi20 Video player component is meant to highlight video content. All video appearances are fully responsive and have baked-in ADA standards (i.e. transcripts, closed captioning, & coming soon — audio descriptions).
There are 2 main appearance types, both with multiple layout appearances:
- Side by side:
- Standard, Pull quote, Key points, and our newest Offset appearance
- Paragraph width:
- With or without a full video playlist
- All main appearances have the ability to remove component-level top padding on or off
- Note: Use this is to solve “double” padding issues when stacking similar colored components together which may cause large gaps to appear, and get pre-approval for guidance from the Design Platform team
- Note: Use this is to solve “double” padding issues when stacking similar colored components together which may cause large gaps to appear, and get pre-approval for guidance from the Design Platform team
Publishing? View the DCR guidebook for detailed instructions.
Standard appearances
Both our Standard & Pull quote appearances have a small or large video player size choice. You can alternate orientations (video left or video right), turn off headlines, CTA’s, and top-padding.
PRO TIP: When stacking this component, stagger the orientation to help create a good visual flow. Also consider the color usage rules and content in terms of the entire page layout. If the videos are part of a series, you may want to keep the background colors the same.
Standard / Small video:
- Use this option when the information contained needs less emphasis than our large appearance
- It is an exact mirror of our CTA with image “medium appearance”, so if your content needs require both a static photography component with a video component, this would be a good match
- The left aligned option aligns the video to our paragraph content block for visual continuity, or you can right align the video so the copy block aligns perfectly to the paragraph copy above/below it.
To help solve climate change, the world needs to transition to using more renewable energy.
Supporting innovation in renewable power is essential to a clean energy future.
Globally, our client investments focused on renewable power have:
Powered more than 2.5 million homes with clean energy.
Saved 360 million cubic meters of water - enough to fill more than 140,000 Olympic-sized pools,
and avoided just over 85 million tons of emissions - that’s like taking 36 million cars off the road.
This is one way we’re helping to build a more sustainable future and transition the planet to net zero.
END CARD: “BLACKROCK // Advancing Sustainability”
Small video appearance: video left
We work only for our clients. Our promise is to give them insight into what to do with their money, providing products and services that can help them build a better financial future.
Standard / Large video:
- Use this option for a more impactful hero video, or a campaign page when you want to highlight a video
- It is an exact mirror of our CTA with image “large appearance”, so if your content needs require both a static photography component with a video component, this would be a good match
- The left aligned option aligns the video to our paragraph content block for visual continuity, or you can right align the video so the copy block aligns perfectly to the paragraph copy above/below it.
We work only for our clients. Our promise is to give them insight into what to do with their money, providing products and services that can help them build a better financial future.
Large video appearance: video left
We work only for our clients. Our promise is to give them insight into what to do with their money, providing products and services that can help them build a better financial future.
Pull quote appearance
Our quote appearance can be used in either sized video (small or large), and has both orientation layouts available. It is a good option when you want to draw in the user by highlighting an important quote specific to the video, which may help with video engagement.
We work only for our clients. Our promise is to give them insight into what to do with their money, providing products and services that can help them build a better financial future.
We work only for our clients. Our promise is to give them insight into what to do with their money, providing products and services that can help them build a better financial future.
Rules and recommendations

Component element | Optional element | Rules | ||
---|---|---|---|---|
Component elementA: Background color options (all appearances) | Optional element | Rules
|
||
Component elementB: Video player | Optional element | Rules
|
||
Component elementb1: Player options | Optional element | Rules
|
||
Component elementC: Transcript | Optional element | Rules
|
||
Component elementD: Headline | Optional element | Rules
|
||
Component elementE: Description / Pull quote | Optional element | Rules
|
||
Component elementF: Component CTA | Optional element | Rules
|
||
Component element*NOTE: Due to varying alphabets and character widths, please ensure your publisher tests this prior to release | Optional element | Rules | ||