1. Design 3D Slicer icons as vector images on a transparent background. Reuse existing Slicer symbols for data and concepts, symbolic colors and other UI patterns where appropriate.
2. At 24x24 pixel resolution, stroke width should be 1dp = 1px for pixel-perfect rendering at resolution multiples of 24. Most of 3D Slicer's icons are designed at 200% scale, at 48x48 pixel resolution, with 1dp=2px.
3. Use simple stroked elements without fill where possible. Stroke caps and corners can be sharp or rounded with r = dp/2.
4. If filled elements are required, use limited color, preferably from Slicer's SimpleColorPalette, consistently across your UI, compatibly with 3D Slicer's application UI. Ensure the fill color works well in both Dark and Light themes.
5. Respect stroke, fill and background colors as defined and named for use in 3D Slicer's SimpleColorPalette for both Dark and Light Themes.
6. Use face-forward icons where possible and orthographic perspective with 45 degree angles where required.
7. Avoid gradients, shadows and other 3D effects.
8. Maintain a padding of 2dp around the icon perimeter when possible.
9. Preview Dark and Light Theme versions of your icons on Dark and Light Theme backgrounds, at multiple resolution to make sure they look great.
10. Ensure all hidden or unused vector elements from SVG files before finalizing work.
| 3DViewersHideRuler.svg | 3DViewersStartStereoscopic.svg | 3DViewersViewFromSuperior.svg | 3DViewersVisibility.svg | 3DViewersShowRuler.svg | 3DViewersYaw.svg | 3DViewersViewFromRight.svg | 3DViewersUsePerspective.svg | 3DViewersViewFromPosterior.svg | 3DViewersStopStereoscopic.svg |
| 3DViewersShowFPS.svg | 3DViewersSpin.svg | 3DViewersPitch.svg | 3DViewersRoll.svg | 3DViewersUnlinkAll3DViewers.svg | 3DViewersViewFromInferior.svg | 3DViewersLinkAll3DViewers.svg | 3DViewersOrientationMarker.svg | 3DViewersZoomIn.svg | 3DViewersHideFPS.svg |
| 3DViewersZoomOut.svg | 3DViewersViewRecentered.svg | 3DViewersViewFromLeft.svg | 3DViewersRock.svg | 3DViewersUseOrthographic.svg | 3DViewersShadows.svg | 3DViewersViewFromAnterior.svg | 3DViewersCentered.svg | 3DViewersMoreOptions.svg | |
| SlicerRightArrow.svg | SlicerDoubleArrowLeft.svg | SlicerDoubleArrowRight.svg | SlicerDownArrow.svg | SlicerUpArrow.svg | SlicerDoubleArrowUp.svg | SlicerLeftArrow.svg | SlicerDoubleArrowDown.svg |
| SlicerInfoLeft.svg | SlicerPending1-of-3.svg | SlicerStarting.svg | SlicerInfo.svg | SlicerHourglassBottomFull.svg | SlicerWarning.svg | SlicerComplete.svg | SlicerError.svg | SlicerHome.svg | SlicerInfoRight.svg |
| SlicerHelp.svg | SlicerComment.svg | SlicerHourglassWorking.svg | SlicerPending3-of-3.svg | SlicerPending2-of-3.svg | SlicerEmptyHourglass.svg | SlicerHourglassTopFull.svg | |||
| SlicerConfigure.svg | SlicerExtensions.svg |
| LowerLayer.svg | ShowLayersUI.svg | RaiseLayer.svg | HideLayersUI.svg | DeleteLayer.svg | AddLayer.svg |
| SlicerUnion.svg | SlicerDifference.svg | SlicerIntersection.svg | SlicerExclusion.svg |
| SlicerSegmentStatistics.svg | SlicerPlotSeries.svg | SlicerInteractivePlotting.svg |
| SlicerRecordOrRecording.svg | SlicerFirstOrSkipBackward.svg | SlicerPause.svg | SlicerLastOrSkipForward.svg | SlicerForward.svg | SlicerLoop.svg | SlicerStoppedOrNotRecording.svg | SlicerPlay.svg | SlicerBack.svg |
| MouseHierarchy.svg | BasicStudyHierarchy.svg | CatHierarchy.svg | PigHierarchy.svg | MouseSubject.svg | CatSubject.svg | MonkeySubject.svg | PigSubject.svg | MonkeyHierarchy.svg | TeddySubject.svg |
| HumanSubject.svg | SlicerDataHierarchy.svg | BasicStudy.svg | RectangleHierarchy.svg | HumanHierarchy.svg | RatHierarchy.svg | RectangleSubject.svg | RatSubject.svg | TeddyHierarchy.svg | |
| SlicerTableUnLockRowHeader.svg | SlicerTableMoveColumnRight.svg | SlicerTable.svg | SlicerTableUnLockColumnHeader.svg | SlicerTableMoveColumnLeft.svg | SlicerTableMoveRowUp.svg | SlicerTableDeleteColumn.svg | SlicerTableMoveRowDown.svg | SlicerTableAddRow.svg | SlicerTableLockColumnHeader.svg |
| SlicerTableAddColumn.svg | SlicerTableLockRowHeader.svg | SlicerTableDeleteRow.svg | |||||||
| SlicerToggleOffLeft.svg | SlicerToggleCheckBox.svg | SlicerToggleOnRight.svg | SlicerToggleRadioButton.svg | SlicerToggleCheckBoxAll.svg | SlicerToggleVisibility.svg | SlicerToggleLock.svg | SlicerToggleLink.svg |
| SlicerLinearTransform.svg | SlicerRemoveTransform.svg | SlicerTransform.svg | SlicerAddTransform.svg | SlicerDeformableTransform.svg |
| SlicerLock.svg | SlicerUnCheckBox.svg | SlicerLink.svg | SlicerCheckBoxAll.svg | SlicerTrash.svg | SlicerMoreOptionsHoriz.svg | SlicerSearch.svg | SlicerBlock.svg | SlicerMinus.svg | SlicerCancel.svg |
| SlicerUnPin.svg | SlicerReset.svg | SlicerDone.svg | SlicerRemove.svg | SlicerRestore.svg | SlicerUndo.svg | SlicerMoreOptionsVert.svg | SlicerSelectColor.svg | SlicerUnCheckBoxAll.svg | SlicerAdd.svg |
| SlicerUnlock.svg | SlicerPin.svg | SlicerUnlink.svg | SlicerCheckBox.svg | SlicerUnHotLink.svg | SlicerHotLink.svg | SlicerRedo.svg | |||
| SlicerInvisible.svg | SlicerVisible.svg | SlicerSubsetVisibility.svg |
| SlicerSceneViewCaptureV2.svg | SlicerSceneViewRestoreOrDeleteV2.svg | SlicerSceneViewCapture.svg | SlicerSceneViewRestoreOrDelete.svg | SlicerCapture.svg |
| SlicerDownload.svg | DICOMIO.svg | SlicerLoadData.svg | SlicerLoadFromCloud.svg | SlicerDownloadBundle.svg | SlicerSaveToCloud.svg | SlicerSaveData.svg | SlicerUpload.svg | SlicerDownloadExtension.svg |
| ModuleHistory.svg | ModulePrevious.svg | ModuleNext.svg | ModuleSearch.svg | SelectModule.svg |
| MarkupsModule.svg | TransformsModule.svg | SegmentEditorModule.svg | WelcomeModule.svg | Annotations.svg | SegmentationsModule.svg | DefaultModule.svg | DataModule.svg | ModelsModule.svg | VolumesModule.svg |
| MarkupsAddLine.svg | MarkupsAddPointList.svg | MarkupsAddROI.svg | MarkupsAddClosedCurve.svg | MarkupsAddAngle.svg | MarkupsAddPlane.svg | MarkupsAddOpenCurve.svg | MarkupsAddPoint.svg |
| Margins.svg | Show3D.svg | FastMarching.svg | Threshold.svg | Draw.svg | SplitVolume.svg | Paint.svg | SlicerTrash.svg | FillBetweenSlices.svg | FloodFill.svg |
| Engrave.svg | SegmentTubes.svg | LogicalOperations.svg | LocalThreshold.svg | Hide3D.svg | Hollow.svg | SlicerRemove.svg | Erase.svg | GrowFromSeed.svg | SurfaceCut.svg |
| Watershed.svg | GoToSegmentationsModule.svg | SlicerUndo.svg | Select.svg | SlicerAdd.svg | MaskVolume.svg | Smooth.svg | LevelTrace.svg | Islands.svg | SlicerRedo.svg |
| ContentCut.svg | |||||||||
| SlicerIHE-Pan.svg | SlicerIHE-CineStepForward.svg | SlicerIHE-SelectViewport.svg | SlicerIHE-LayoutWithinViewport.svg | SlicerIHE-CinePlay.svg | SlicerIHE-Help.svg | SlicerIHE-FlipHorizontal.svg | SlicerIHE-Crosshair.svg | SlicerIHE-CineGoToStart.svg | SlicerIHE-PreviousFrame.svg |
| SlicerIHE-UnLink.svg | SlicerIHE-Rotate90Clockwise.svg | SlicerIHE-NextFrame.svg | SlicerIHE-ZoomIn.svg | SlicerIHE-PrevioustStudy.svg | SlicerIHE-LocalizerLines.svg | SlicerIHE-SelectPatient.svg | SlicerIHE-Scroll.svg | SlicerIHE-Print.svg | SlicerIHE-CineStepBackward.svg |
| SlicerIHE-DisplayReset.svg | SlicerIHE-AdvancedMoreOptions.svg | SlicerIHE-LayoutMultipleViewports.svg | SlicerIHE-CineGoToEnd.svg | SlicerIHE-RulerMeasure.svg | SlicerIHE-Link.svg | SlicerIHE-PreviousFrameSet.svg | SlicerIHE-ShowReport.svg | SlicerIHE-CineTools.svg | SlicerIHE-Annotation.svg |
| SlicerIHE-WindowLevelColor.svg | SlicerIHE-NextFrameSet.svg | SlicerIHE-InvertGreyscale.svg | SlicerIHE-NextStudy.svg | SlicerIHE-CineStop.svg | SlicerIHE-ZoomOut.svg | SlicerIHE-AngleMeasure.svg | |||
| SlicerMarkupsMenuToggle.svg | SlicerWindowLevel.svg | SlicerMouseModeTransformAdjust.svg |
| BlendMode.svg | RulerDisplayOptions.svg | RotateToVolumePlane.svg | OrientationMarker.svg | LabelMapDisplayFill.svg | SlicePlanes-Sagittal.svg | LightboxView.svg | LabelMapDisplayOutline.svg | SegmentationDisplayFillAndOutline.svg | ResetFieldOfView.svg |
| SegmentationLayer.svg | ToggleOFF-MaximizeView.svg | ToggleOFF-ReformatWidget.svg | ForegroundLayer.svg | ThickSlabReconstruction.svg | BackgroundLayer.svg | SliceSpacing.svg | SegmentationDisplayOutline.svg | ToggleON-Interpolation.svg | LabelMapLayer.svg |
| SlicePlanes-Coronal.svg | EachSegmentVisibility.svg | ToggleON-ReformatWidget.svg | ToggleON-MaximizeView.svg | SegmentationDisplayFill.svg | ToggleOFF-Interpolation.svg | LabelMapDisplayFillAndOutline.svg | SlicePlanes-Axial.svg | ||
| SlicerInvisible.svg | SlicerDataBundle.svg | SlicerUpPointingSelect.svg | SlicerCloud.svg | SlicerRightPointingSelect.svg | SlicerSimple3DView.svg | SlicerSearch.svg | SlicerVisible.svg | SlicerGrid.svg | SlicerDatabase.svg |
| Slicer3DView.svg | SlicerSliceView.svg | SlicerSlashForNoNotOff.svg | SlicerFolder.svg | SlicerLeftPointingSelect.svg | |||||
| SlicerMarkupPoint.svg | SlicerTable.svg | SlicerAIsparkles.svg | SlicerDataBundle.svg | SlicerDatabase.svg | SlicerSourceVolume.svg | SlicerModel.svg | SlicerDataHierarchy.svg | SlicerTransform.svg | SlicerSegmentation.svg |
| SlicerScalarVolume.svg | |||||||||
| SlicerSlicePlanesOptions.svg | SlicerCrosshair.svg |
| SlicerRedSliceOnlyView.svg | SlicerYellowSliceOnlyView.svg | SlicerGreenSliceLightbox.svg | SlicerDual3DView.svg | SlicerCompareGridView.svg | SlicerFourUpPlotView.svg | SlicerThreeOverThreePlotView.svg | SlicerFourByTwoSliceView.svg | SlicerTabbed3DView.svg | SlicerRedSliceLightbox.svg |
| SlicerYellowSliceLightbox.svg | SlicerGreenSliceOnlyView.svg | SlicerFourUpQuantitativeView.svg | SlicerFourByThreeSliceView.svg | SlicerCompareWidescreenView.svg | SlicerConventionalWidescreenView.svg | SlicerPlotOnlyView.svg | SlicerTwoOverTwoSliceView.svg | SlicerFourUpTableView.svg | SlicerConventionalView.svg |
| SlicerConventionalPlotView.svg | SlicerThreeOverThreeSliceView.svg | Slicer3DOnlyView.svg | SlicerSideBySideSliceView.svg | SlicerTabbedSliceView.svg | SlicerTriple3DView.svg | SlicerFourUpView.svg | SlicerThreeByThreeSliceView.svg | SlicerFourOverFourView.svg | SlicerCompareView.svg |
| Slicer3DTableView.svg | |||||||||
| SlicerRedSliceOnlyView.svg | SlicerYellowSliceOnlyView.svg | SlicerGreenSliceLightbox.svg | SlicerDual3DView.svg | SlicerCompareGridView.svg | SlicerFourUpPlotView.svg | SlicerThreeOverThreePlotView.svg | SlicerFourByTwoSliceView.svg | SlicerTabbed3DView.svg | SlicerRedSliceLightbox.svg |
| SlicerYellowSliceLightbox.svg | SlicerGreenSliceOnlyView.svg | SlicerFourUpQuantitativeView.svg | SlicerFourByThreeSliceView.svg | SlicerCompareWidescreenView.svg | SlicerConventionalWidescreenView.svg | SlicerPlotOnlyView.svg | SlicerTwoOverTwoSliceView.svg | SlicerFourUpTableView.svg | SlicerConventionalView.svg |
| SlicerConventionalPlotView.svg | SlicerThreeOverThreeSliceView.svg | Slicer3DOnlyView.svg | SlicerSideBySideSliceView.svg | SlicerTabbedSliceView.svg | SlicerTriple3DView.svg | SlicerFourUpView.svg | SlicerThreeByThreeSliceView.svg | SlicerFourOverFourView.svg | SlicerCompareView.svg |
| Slicer3DTableView.svg | |||||||||
| SlicerHideModelScalarOverlay.svg | SlicerShowDeformationGrid.svg | SlicerShowVolumeScalarOverlay.svg | SlicerShowGrid.svg | SlicerHideDeformationGrid.svg | SlicerHideSphereGlyphs.svg | SlicerHideIsoContours.svg | SlicerShowIsoContours.svg | SlicerShowSphereGlyphs.svg | SlicerShowConeGlyphs.svg |
| SlicerHideArrowGlyphs.svg | SlicerShowArrowGlyphs.svg | SlicerHideVolumeScalarOverlay.svg | SlicerShowIsoSurfaces.svg | SlicerHideIsoSurfaces.svg | SlicerHideConeGlyphs.svg | SlicerSelectColor.svg | SlicerHideGrid.svg | SlicerShowModelScalarOverlay.svg | |