diff --git a/.changeset/famous-apples-yell.md b/.changeset/famous-apples-yell.md
new file mode 100644
index 0000000000..8c0c8bbdb7
--- /dev/null
+++ b/.changeset/famous-apples-yell.md
@@ -0,0 +1,5 @@
+---
+'@leafygreen-ui/icon': minor
+---
+
+Adds `Moon` and `Sun` glyphs.
diff --git a/packages/icon/README.md b/packages/icon/README.md
index 6865a884a2..4608f7b77a 100644
--- a/packages/icon/README.md
+++ b/packages/icon/README.md
@@ -47,13 +47,13 @@ const SomeComponent = () => ;
## Properties
-| Prop | Type | Description | Default |
-| ------------------ | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ----------- |
-| `glyph` (Required) | `'ActivityFeed'`, `'AddFile'`, `'AllProducts'`, `'Apps'`, `'Array'`, `'ArrowDown'`, `'ArrowLeft'`, `'ArrowRight'`, `'ArrowUp'`, `'Beaker'`, `'Bell'`, `'Biometric'`, `'Boolean'`, `'Building'`, `'Bulb'`, `'Calendar'`, `'Camera'`, `'Cap'`, `'CaretDown'`, `'CaretLeft'`, `'CaretRight'`, `'CaretUp'`, `'ChartFilled'`, `'Charts'`, `'Checkmark'`, `'CheckmarkWithCircle'`, `'ChevronDown'`,, `'ChevronLeft'` `'ChevronRight'`,`'ChevronUp'`, `'Clock'`,`'ClockWithArrow'`, `'Clone'`, `'Cloud'`, `'Code'`, `'CodeBlock'`,`'Colon'`, `'Connect'`,`'Copy'`,`'CreditCard'`, `'CurlyBraces'`, `'Dashboard'`, `'Database'`, `'Diagram'`, `'Diagram2'`, `'Diagram3'`, `'Disconnect'`, `'Download'`, `'Drag'`, `'Edit'`, `'Ellipsis'`, `'Email'`, `'Eraser'`, `'Escalation'`, `'Export'`, `'Favorite'`, `'Federation'`, `'File'`, `'Filter'`,`'Folder'`, `'Format'`, `'FullScreenEnter'`, `'FullScreenExit'`, `'Guage'`, `'GlobeAmericas'`, `'GovernmentBuilding'`, `'Hash'`, `'Highlight'`, `'Home'`, `'HorizontalDrag'`, `'Import'`, `'ImportantWithCircle'`, `'InfoWithCircle'`, `'InternalEmployee'`, `'InviteUser'`, `'Key'`, `'Laptop'`, `'LightningBolt'`, `'Link'`, `'List'`, `'Lock'`, `'LogIn'`, `'LogOut'`, `'MagnifyingGlass'`, `'Megaphone'`, `'Menu'`, `'Minus'`, `'Mobile'`, `'MultiDirectionArrow'`, `'MultiLayers'`, `'NavCollapse'`, `'NavExpand'`, `'NoFilter'`, `'NotAllowed'`, `'Note'`, `'OpenNewTab'`, `'Pause'`, `'Person'`, `'PersonGroup'`, `'PersonWithLock'`, `'Pin'`, `'Play'`, `'Plus'`, `'PlusWithCircle'`, `'Primary'`, `'Project'`, `'QuestionMarkWithCircle'`, `'Read'`, `'Recommended'`, `'Redo'`, `'Refresh'`,`'Relationship'`, `'ReplicaSet'`,`'Resize'`, `'Return'`, `'Save'`, `'SearchIndex'`, `'Secondary'`, `'Serverless'`, `'Settings'`, `'ShardedCluster'`, `'Shell'`, `'SMS'`,`'SortAscending'`, `'SortDescending'`, `'SortHorizontal'`, `'SortVertical'`,`'Sparkle'`, `'SplitHorizontal'`, `'SplitVertical'`, `'Stitch'`, `'String'`, `'Support'`, `'Sweep'`, `'Table'`, `'Tag'`, `'ThumbsDown'`, `'ThumbsUp'`, `'TimeSeries'`, `'TimeSeriesCollection'`, `'Trash'`, `'Undo'`, `'University'`, `'Unlock'`, `'Unsorted'`, `'UpDownCarets'`, `'Upload'`, `'VerticalEllipsis'`, `'Visibility'`, `'VisibilityOff'`, `'Warning'`, `'Wizard'`, `'Wrench'`, `'Write'`,`'X'`, `'XWithCircle'` | Specifies the glyph to use. | |
-| `size` | `'small'`, `'default'`, `'large'`, `'xlarge'`, `number` | The height and width of the glyph's viewBox. This can be any `number` or one of the following `'small'`, `'default'`, `'large'`, `'xlarge'` | `'default'` |
-| `fill` | `string` | The fill color that is passed to the glyph. By default, the glyph will inherit its fill from the CSS color property of its nearest ancestor. | |
-| `title` | `string`, `boolean`, `null` | Renders a title tag with the passed string within the SVG element for screen reader accessibility. Setting this value to `false` will entirely unset the title.
If title is `undefined` or `null`, a human-readable title will be generated based on the glyph's name. | |
-| ... | `SVGR.ComponentProps` | All other props will be spread on the `svg` element | |
+| Prop | Type | Description | Default |
+| ------------------ | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ----------- |
+| `glyph` (Required) | `'ActivityFeed'`, `'AddFile'`, `'AllProducts'`, `'Apps'`, `'Array'`, `'ArrowDown'`, `'ArrowLeft'`, `'ArrowRight'`, `'ArrowUp'`, `'Beaker'`, `'Bell'`, `'Biometric'`, `'Boolean'`, `'Building'`, `'Bulb'`, `'Calendar'`, `'Camera'`, `'Cap'`, `'CaretDown'`, `'CaretLeft'`, `'CaretRight'`, `'CaretUp'`, `'ChartFilled'`, `'Charts'`, `'Checkmark'`, `'CheckmarkWithCircle'`, `'ChevronDown'`,, `'ChevronLeft'` `'ChevronRight'`,`'ChevronUp'`, `'Clock'`,`'ClockWithArrow'`, `'Clone'`, `'Cloud'`, `'Code'`, `'CodeBlock'`,`'Colon'`, `'Connect'`,`'Copy'`,`'CreditCard'`, `'CurlyBraces'`, `'Dashboard'`, `'Database'`, `'Diagram'`, `'Diagram2'`, `'Diagram3'`, `'Disconnect'`, `'Download'`, `'Drag'`, `'Edit'`, `'Ellipsis'`, `'Email'`, `'Eraser'`, `'Escalation'`, `'Export'`, `'Favorite'`, `'Federation'`, `'File'`, `'Filter'`,`'Folder'`, `'Format'`, `'FullScreenEnter'`, `'FullScreenExit'`, `'Guage'`, `'GlobeAmericas'`, `'GovernmentBuilding'`, `'Hash'`, `'Highlight'`, `'Home'`, `'HorizontalDrag'`, `'Import'`, `'ImportantWithCircle'`, `'InfoWithCircle'`, `'InternalEmployee'`, `'InviteUser'`, `'Key'`, `'Laptop'`, `'LightningBolt'`, `'Link'`, `'List'`, `'Lock'`, `'LogIn'`, `'LogOut'`, `'MagnifyingGlass'`, `'Megaphone'`, `'Menu'`, `'Minus'`, `'Mobile'`, `'Moon'`, `'MultiDirectionArrow'`, `'MultiLayers'`, `'NavCollapse'`, `'NavExpand'`, `'NoFilter'`, `'NotAllowed'`, `'Note'`, `'OpenNewTab'`, `'Pause'`, `'Person'`, `'PersonGroup'`, `'PersonWithLock'`, `'Pin'`, `'Play'`, `'Plus'`, `'PlusWithCircle'`, `'Primary'`, `'Project'`, `'QuestionMarkWithCircle'`, `'Read'`, `'Recommended'`, `'Redo'`, `'Refresh'`,`'Relationship'`, `'ReplicaSet'`,`'Resize'`, `'Return'`, `'Save'`, `'SearchIndex'`, `'Secondary'`, `'Serverless'`, `'Settings'`, `'ShardedCluster'`, `'Shell'`, `'SMS'`,`'SortAscending'`, `'SortDescending'`, `'SortHorizontal'`, `'SortVertical'`,`'Sparkle'`, `'SplitHorizontal'`, `'SplitVertical'`, `'Stitch'`, `'String'`, `'Sun'`, `'Support'`, `'Sweep'`, `'Table'`, `'Tag'`, `'ThumbsDown'`, `'ThumbsUp'`, `'TimeSeries'`, `'TimeSeriesCollection'`, `'Trash'`, `'Undo'`, `'University'`, `'Unlock'`, `'Unsorted'`, `'UpDownCarets'`, `'Upload'`, `'VerticalEllipsis'`, `'Visibility'`, `'VisibilityOff'`, `'Warning'`, `'Wizard'`, `'Wrench'`, `'Write'`,`'X'`, `'XWithCircle'` | Specifies the glyph to use. | |
+| `size` | `'small'`, `'default'`, `'large'`, `'xlarge'`, `number` | The height and width of the glyph's viewBox. This can be any `number` or one of the following `'small'`, `'default'`, `'large'`, `'xlarge'` | `'default'` |
+| `fill` | `string` | The fill color that is passed to the glyph. By default, the glyph will inherit its fill from the CSS color property of its nearest ancestor. | |
+| `title` | `string`, `boolean`, `null` | Renders a title tag with the passed string within the SVG element for screen reader accessibility. Setting this value to `false` will entirely unset the title.
If title is `undefined` or `null`, a human-readable title will be generated based on the glyph's name. | |
+| ... | `SVGR.ComponentProps` | All other props will be spread on the `svg` element | |
# createIconComponent
diff --git a/packages/icon/src/generated/Moon.tsx b/packages/icon/src/generated/Moon.tsx
new file mode 100644
index 0000000000..3f91f33f0e
--- /dev/null
+++ b/packages/icon/src/generated/Moon.tsx
@@ -0,0 +1,45 @@
+/**
+* This is a generated file. Do not modify it manually.
+*
+* @script ./node_modules/.bin/ts-node packages/icon/scripts/build.ts
+* @checksum 4c2d7672aa71f7e5c28bcdf6b86b5832
+*/
+import * as React from "react";
+import PropTypes from 'prop-types';
+import { css, cx } from '@leafygreen-ui/emotion';
+import { generateAccessibleProps, sizeMap } from '../glyphCommon';
+import { LGGlyph } from '../types';
+export interface MoonProps extends LGGlyph.ComponentProps {}
+const Moon = ({
+ className,
+ size = 16,
+ title,
+ ['aria-label']: ariaLabel,
+ ['aria-labelledby']: ariaLabelledby,
+ fill,
+ role = 'img',
+ ...props
+}: MoonProps) => {
+ const fillStyle = css`
+ color: ${fill};
+ `;
+ const noFlexShrink = css`
+ flex-shrink: 0;
+ `;
+ const accessibleProps = generateAccessibleProps(role, 'Moon', {
+ title,
+ ['aria-label']: ariaLabel,
+ ['aria-labelledby']: ariaLabelledby
+ });
+ return ;
+};
+Moon.displayName = 'Moon';
+Moon.isGlyph = true;
+Moon.propTypes = {
+ fill: PropTypes.string,
+ size: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
+ className: PropTypes.string
+};
+export default Moon;
\ No newline at end of file
diff --git a/packages/icon/src/generated/Sun.tsx b/packages/icon/src/generated/Sun.tsx
new file mode 100644
index 0000000000..6e4d957e72
--- /dev/null
+++ b/packages/icon/src/generated/Sun.tsx
@@ -0,0 +1,45 @@
+/**
+* This is a generated file. Do not modify it manually.
+*
+* @script ./node_modules/.bin/ts-node packages/icon/scripts/build.ts
+* @checksum 0c0cdc9afd7329ab5567a45016c55163
+*/
+import * as React from "react";
+import PropTypes from 'prop-types';
+import { css, cx } from '@leafygreen-ui/emotion';
+import { generateAccessibleProps, sizeMap } from '../glyphCommon';
+import { LGGlyph } from '../types';
+export interface SunProps extends LGGlyph.ComponentProps {}
+const Sun = ({
+ className,
+ size = 16,
+ title,
+ ['aria-label']: ariaLabel,
+ ['aria-labelledby']: ariaLabelledby,
+ fill,
+ role = 'img',
+ ...props
+}: SunProps) => {
+ const fillStyle = css`
+ color: ${fill};
+ `;
+ const noFlexShrink = css`
+ flex-shrink: 0;
+ `;
+ const accessibleProps = generateAccessibleProps(role, 'Sun', {
+ title,
+ ['aria-label']: ariaLabel,
+ ['aria-labelledby']: ariaLabelledby
+ });
+ return ;
+};
+Sun.displayName = 'Sun';
+Sun.isGlyph = true;
+Sun.propTypes = {
+ fill: PropTypes.string,
+ size: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
+ className: PropTypes.string
+};
+export default Sun;
\ No newline at end of file
diff --git a/packages/icon/src/glyphs/Moon.svg b/packages/icon/src/glyphs/Moon.svg
new file mode 100644
index 0000000000..67d28ff491
--- /dev/null
+++ b/packages/icon/src/glyphs/Moon.svg
@@ -0,0 +1,3 @@
+
diff --git a/packages/icon/src/glyphs/Sun.svg b/packages/icon/src/glyphs/Sun.svg
new file mode 100644
index 0000000000..5ca75b4b5b
--- /dev/null
+++ b/packages/icon/src/glyphs/Sun.svg
@@ -0,0 +1,11 @@
+
diff --git a/packages/icon/src/glyphs/index.ts b/packages/icon/src/glyphs/index.ts
index 66cf42f8f8..b52f0b9fa2 100644
--- a/packages/icon/src/glyphs/index.ts
+++ b/packages/icon/src/glyphs/index.ts
@@ -91,6 +91,7 @@ import Megaphone from './Megaphone.svg';
import Menu from './Menu.svg';
import Minus from './Minus.svg';
import Mobile from './Mobile.svg';
+import Moon from './Moon.svg';
import MultiDirectionArrow from './MultiDirectionArrow.svg';
import MultiLayers from './MultiLayers.svg';
import NavCollapse from './NavCollapse.svg';
@@ -133,6 +134,7 @@ import SplitHorizontal from './SplitHorizontal.svg';
import SplitVertical from './SplitVertical.svg';
import Stitch from './Stitch.svg';
import String from './String.svg';
+import Sun from './Sun.svg';
import Support from './Support.svg';
import Sweep from './Sweep.svg';
import Table from './Table.svg';
@@ -248,6 +250,7 @@ const _glyphs = {
Menu,
Minus,
Mobile,
+ Moon,
MultiDirectionArrow,
MultiLayers,
NavCollapse,
@@ -290,6 +293,7 @@ const _glyphs = {
SplitVertical,
Stitch,
String,
+ Sun,
Support,
Sweep,
Table,