@leafygreen-ui/logo NPM

Logo

View on MongoDB.design

Installation

Yarn

yarn add @leafygreen-ui/logo

NPM

npm install @leafygreen-ui/logo

Example

import {
  MongoDBLogo,
  MongoDBLogoMark,
  AtlasLogoLockup,
  CommunityEditionLogoLockup,
  EnterpriseAdvancedLogoLockup,
} from '@leafygreen-ui/logo';

return <MongoDBLogo />;

Output HTML

<svg
  role="img"
  aria-label="MongoDB Logo"
  class="leafygreen-ui-6pysb5"
  height="40"
  viewBox="0 0 127 32"
  fill="none"
>
  <path d="..." fill="#00684A"></path>
  <path d="..." fill="#00684A"></path>
  <path d="..." fill="#00684A"></path>
  <path d="..." fill="#00684A"></path>
  <path d="..." fill="#00684A"></path>
  <path d="..." fill="#00684A"></path>
  <path d="..." fill="#00684A"></path>
  <path d="..." fill="#00684A"></path>
  <path d="..." fill="#00684A"></path>
</svg>

MongoDBLogo

Properties

Prop	Type	Description	Default
`height`	`number`	Sets the height of the component.	`40`
`color`	`'white'`, `'black'`, `'green-dark-2'`, `'green-base'`	Sets the color of the component.	`'green-dark-2'`
`className`	`string`	Adds a className to the root `<svg>` element.

MongoDBLogoMark

Properties

Prop	Type	Description	Default
`height`	`number`	Sets the height of the component.	`40`
`color`	`'white'`, `'black'`, `'green-dark-2'`, `'green-base'`	Sets the color of the component.	`'green-dark-2'`
`className`	`string`	Adds a className to the root `<svg>` element.

AtlasLogoLockup

Properties

Prop	Type	Description	Default
`height`	`number`	Sets the height of the component.	`40`
`color`	`'white'`, `'black'`, `'green-dark-2'`, `'green-base'`	Sets the color of the component.	`'green-dark-2'`
`className`	`string`	Adds a className to the root `<svg>` element.

AtlasForGovernmentLogoLockup

Properties

Prop	Type	Description	Default
`height`	`number`	Sets the height of the component.	`40`
`color`	`'white'`, `'black'`, `'green-dark-2'`, `'green-base'`	Sets the color of the component.	`'green-dark-2'`
`className`	`string`	Adds a className to the root `<svg>` element.

CommunityEditionLogoLockup

Properties

Prop	Type	Description	Default
`height`	`number`	Sets the height of the component.	`40`
`color`	`'white'`, `'black'`, `'green-dark-2'`, `'green-base'`	Sets the color of the component.	`'green-dark-2'`
`className`	`string`	Adds a className to the root `<svg>` element.

EnterpriseAdvancedLogoLockup

Properties

Prop	Type	Description	Default
`height`	`number`	Sets the height of the component.	`40`
`color`	`'white'`, `'black'`, `'green-dark-2'`, `'green-base'`	Sets the color of the component.	`'green-dark-2'`
`className`	`string`	Adds a className to the root `<svg>` element.

UniversityLogoLockup

Properties

Prop	Type	Description	Default
`height`	`number`	Sets the height of the component.	`40`
`color`	`'white'`, `'black'`, `'green-dark-2'`, `'green-base'`	Sets the color of the component.	`'green-dark-2'`
`className`	`string`	Adds a className to the root `<svg>` element.