Icons

General

icon-eye
icon-three-dots
icon-black-eye
icon-table-sort
icon-preloader
icon-watch
icon-celtra-logo
icon-copy-to-clipboard
icon-cog-wheel
icon-trash-bin
icon-trash-bin-big
icon-shared
icon-cross
icon-success
icon-warning
icon-error
icon-creatives
icon-qr-code
icon-window
icon-bell

Analytics

icon-slim-analytics
icon-fat-analytics
icon-expand
icon-finish-flag
icon-funnel
icon-heart
icon-pie
icon-stopwatch
icon-table
icon-rb-download-all-reports
icon-rb-excel-export
icon-rb-html-view
icon-conversions
icon-reporting-center
icon-report-builder
icon-cards
icon-camera-check
icon-sound
icon-expand-rows

Video

icon-play
icon-pause
icon-muted
icon-audible

Video analytics

icon-video-properties
icon-video-user-initiated-play
icon-video-auto-play
icon-video-start-muted
icon-video-start-with-sound
icon-label
icon-unknown
icon-autoplay
icon-user-initiated
icon-user-initiated-point
icon-audibility-muted
icon-audibility-audible
icon-play-circle

Formats

icon-banner
icon-expandable-banner
icon-interstitial
icon-pull
icon-slider
icon-video-banner
icon-video-expandable-banner
icon-video-interstitial
icon-fallback
icon-shazam-for-tv
icon-shazam-for-tvexpandable
icon-lazerbird
icon-stardust
icon-flock-of-birds
icon-social-rich-media
icon-interscroller
icon-reveal
icon-landing-page
icon-video

Audience builder

icon-spinner
icon-group
icon-magnifier
icon-confirm
icon-close
icon-collapse
icon-custom-audience
icon-derived-audience
icon-language-audience
icon-new-audience
icon-rename
icon-trash
icon-upload
icon-uploading
icon-no-create-audience-permissions
icon-neustar
icon-create-neustar

Usage

SVG definitions are available in _includes/icons/svg-icons.html which corresponds to mab/client/templates/svg-icons.thtml


    

Some icons use strokes. For such icons add the icon-strong class to svg.


    

Dimensions

.icon-wrapper svg {
    width  : 48px;
    height : 48px;
}

Colors

By default all icon SVGs will inherit the wrapper's color.

.icon-wrapper { color: #cccccc; }

Positioning

This will horizonatlly and vertically position the icon to center.

.icon-wrapper {
    widht       : 100px;
    height      : 100px;
    line-height : 100px;
    text-align  : center;
}

.icon-wrapper svg { vertical-align: middle; }