Icons

General Icons

General icons via the Bluebeam Icon Font made with IcoMoon. Font Family name is “bluebeam-icons”.

.icon--angleRightCircle \e900
icon--checkCircle \e901
icon--arrowDropDown \e5c5
icon--arrowDropUp \e5c7
icon--block \e14b
icon--calendar \e916
icon--check \e5ca
icon--close \e5cd
icon--errorCircle \e001
icon--arrowUp \e5ce
icon--arrowDown \e5cf
icon--infoCircle \e88f
icon--arrowLeft \e408
icon--arrowRight \e409
icon--playCircle \e039
icon--cart \e8cc
icon--search \e8b6
icon--mail \f003
icon--facebook \f09a
icon--instagram \f16d
icon--linkedin \f0e1
icon--twitter \f099
icon--vine \f1ca
icon--youtube \f16a

Simple Usage:


Add a size modifier to change the size of the icon.

You may also use the font size utility classes such as u-txtLarge.


Easily customize appearence with utility classes.

<p>Simple Usage:</p>

<i class="icon  icon--playCircle" aria-hidden="true"></i>

<hr class="rule  u-my4">

<p>Add a size modifier to change the size of the icon.</p>
<p>You may also use the font size utility classes such as <code>u-txtLarge</code>.</p>

<i class="icon  icon--playCircle  icon--sm" aria-hidden="true"></i>
<i class="icon  icon--playCircle  icon--lg" aria-hidden="true"></i>
<i class="icon  icon--playCircle  icon--xl" aria-hidden="true"></i>
<i class="icon  icon--playCircle  icon--xxl" aria-hidden="true"></i>

<hr class="rule  u-my4">

<p>Easily customize appearence with utility classes.</p>

<i class="icon  icon--playCircle  icon--xl  u-colorPrimary" aria-hidden="true"></i>
<i class="icon  icon--playCircle  icon--xxl  u-colorPrimary  u-txtShadow2  u-opacity50  u-hoverGlow" aria-hidden="true"></i>

Feature Icons (2017)

featureIcon--3dPdfs
featureIcon--batchSlipSheet
featureIcon--compareDocs
featureIcon--compareDocuments
featureIcon--customization
featureIcon--fileAccess
featureIcon--integration
featureIcon--legends
featureIcon--markupsList
featureIcon--measure
featureIcon--navigate
featureIcon--ocr
featureIcon--overlayPages
featureIcon--pdfCreation
featureIcon--pdfEditing
featureIcon--pdfForms
featureIcon--pin
featureIcon--redaction
featureIcon--scripts
featureIcon--search
featureIcon--security
featureIcon--sets
featureIcon--sketchTools
featureIcon--structures
featureIcon--studio
featureIcon--toolChest
<i class="featureIcon  featureIcon--3dPdfs" aria-hidden="true"></i>

<!-- Increase or decrease the size using text size utility classes. -->
<i class="featureIcon  featureIcon--3dPdfs  u-txtHuge" aria-hidden="true"></i>

Feature Icons 2018

featureIcon--3D--dark--2018
featureIcon--3D--light--2018
featureIcon--AutomaticFormDetection--dark--2018
featureIcon--AutomaticFormDetection--light--2018
featureIcon--BatchSets--dark--2018
featureIcon--BatchSets--light--2018
featureIcon--BatchSlipSheet--dark--2018
featureIcon--BatchSlipSheet--light--2018
featureIcon--Capture--dark--2018
featureIcon--Capture--light--2018
featureIcon--CompareDocuments--dark--2018
featureIcon--CompareDocuments--light--2018
featureIcon--Customization--dark--2018
featureIcon--Customization--light--2018
featureIcon--DMSIntegration--dark--2018
featureIcon--DMSIntegration--light--2018
featureIcon--DynamicFill--dark--2018
featureIcon--DynamicFill--light--2018
featureIcon--FileAccess--dark--2018
featureIcon--FileAccess--light--2018
featureIcon--Legends--dark--2018
featureIcon--Legends--light--2018
featureIcon--Linked--dark--2018
featureIcon--Linked--light--2018
featureIcon--Links--dark--2018
featureIcon--Links--light--2018
featureIcon--Markups--dark--2018
featureIcon--Markups--light--2018
featureIcon--MarkupsList--dark--2018
featureIcon--MarkupsList--light--2018
featureIcon--Measure--dark--2018
featureIcon--Measure--light--2018
featureIcon--Multiview--dark--2018
featureIcon--Multiview--light--2018
featureIcon--OCR--dark--2018
featureIcon--OCR-light--2018
featureIcon--OverlayPages--dark--2018
featureIcon--OverlayPages--light--2018
featureIcon--PDFCreation--dark--2018
featureIcon--PDFCreation--light--2018
featureIcon--PDFEditing--dark--2018
featureIcon--PDFEditing--light--2018
featureIcon--PDFForm--dark--2018
featureIcon--PDFForm--light--2018
featureIcon--PDFTemplate--dark--2018
featureIcon--PDFTemplate--light--2018
featureIcon--Profiles--dark--2018
featureIcon--Profiles--light--2018
featureIcon--Redaction--dark--2018
featureIcon--Redaction--light--2018
featureIcon--Scripts--dark--2018
featureIcon--Scripts--light--2018
featureIcon--Security--dark--2018
featureIcon--Security--light--2018
featureIcon--Sets--dark--2018
featureIcon--Sets--light--2018
featureIcon--SketchTools--dark--2018
featureIcon--SketchTools--light--2018
featureIcon--Snapshot--dark--2018
featureIcon--Snapshot--light--2018
featureIcon--Stamp--dark--2018
featureIcon--Stamp--light--2018
featureIcon--Tags--dark--2018
featureIcon--Tags--light--2018
featureIcon--ToolChest--dark--2018
featureIcon--ToolChest--light--2018
featureIcon--VisualSearch--dark--2018
featureIcon--VisualSearch--light--2018
<i class="featureIcon  featureIcon--Redaction--dark--2018" aria-hidden="true"></i>

<!-- Increase or decrease the size using text size utility classes. -->
<i class="featureIcon  featureIcon--Redaction--dark--2018  u-txtHuge" aria-hidden="true"></i>

Bluebeam Icon

<!-- Adjust the value of "width" as needed. -->
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 47 47" width="60" class="u-block  u-fillPrimary">
  <g class="bluebeamBug"><path d="M15.9 31.8V15.9h15.9v15.9H15.9zM15.9 0v7.9h23.8v31.8H7.9V0H0v47.6h47.6V0H15.9z"/></g>
</svg>