diff --git a/sites/shared/components/designs/linedrawings/index.mjs b/sites/shared/components/designs/linedrawings/index.mjs
index b8644b6dcbc..64a5175d10a 100644
--- a/sites/shared/components/designs/linedrawings/index.mjs
+++ b/sites/shared/components/designs/linedrawings/index.mjs
@@ -14,6 +14,8 @@ import { Bruce, BruceFront, BruceBack } from 'shared/components/designs/linedraw
import { Diana, DianaFront, DianaBack } from 'shared/components/designs/linedrawings/diana.mjs'
import { Florence, FlorenceFront } from 'shared/components/designs/linedrawings/florence.mjs'
import { Lucy, LucyFront } from 'shared/components/designs/linedrawings/lucy.mjs'
+import { Lumina, LuminaFront, LuminaBack } from 'shared/components/designs/linedrawings/lumina.mjs'
+import { Lumira, LumiraFront, LumiraBack } from 'shared/components/designs/linedrawings/lumira.mjs'
import { Noble, NobleFront, NobleBack } from 'shared/components/designs/linedrawings/noble.mjs'
import { Hortensia, HortensiaFront } from 'shared/components/designs/linedrawings/hortensia.mjs'
import { Simon, SimonFront, SimonBack } from 'shared/components/designs/linedrawings/simon.mjs'
@@ -40,6 +42,8 @@ export const lineDrawingsFront = {
diana: DianaFront,
florence: FlorenceFront,
lucy: LucyFront,
+ lumina: LuminaFront,
+ lumira: LumiraFront,
noble: NobleFront,
hortensia: HortensiaFront,
simon: SimonFront,
@@ -57,6 +61,8 @@ export const lineDrawingsBack = {
brian: BrianBack,
bruce: BruceBack,
diana: DianaBack,
+ lumina: LuminaBack,
+ lumira: LumiraBack,
noble: NobleBack,
simon: SimonBack,
tristan: TristanBack,
@@ -78,6 +84,8 @@ export const lineDrawings = {
diana: Diana,
florence: Florence,
lucy: Lucy,
+ lumina: Lumina,
+ lumira: Lumira,
noble: Noble,
hortensia: Hortensia,
simon: Simon,
diff --git a/sites/shared/components/designs/linedrawings/lucy.mjs b/sites/shared/components/designs/linedrawings/lucy.mjs
index 1cb7c1e748b..370007d8197 100644
--- a/sites/shared/components/designs/linedrawings/lucy.mjs
+++ b/sites/shared/components/designs/linedrawings/lucy.mjs
@@ -40,7 +40,39 @@ export const Front = ({ stroke }) => (
<>
>
)
diff --git a/sites/shared/components/designs/linedrawings/lumina.mjs b/sites/shared/components/designs/linedrawings/lumina.mjs
new file mode 100644
index 00000000000..6a3c653e870
--- /dev/null
+++ b/sites/shared/components/designs/linedrawings/lumina.mjs
@@ -0,0 +1,160 @@
+import { LineDrawingWrapper, thin, dashed } from './shared.mjs'
+
+const strokeScale = 0.5
+
+export const Lumina = ({
+ className = 'w-64', // CSS classes to apply
+ stroke = 1, // Stroke width to use
+}) => {
+ // Normalize stroke across designs
+ stroke = stroke * strokeScale
+
+ return (
+
+
+
+
+ )
+}
+
+/*
+ * React component for the front
+ */
+export const LuminaFront = ({
+ className = 'w-64', // CSS classes to apply
+ stroke = 1, // Stroke width to use
+}) => {
+ // Normalize stroke across designs
+ stroke = stroke * strokeScale
+
+ return (
+
+
+
+ )
+}
+
+/*
+ * React component for the back
+ */
+export const LuminaBack = ({
+ className = 'w-64', // CSS classes to apply
+ stroke = 1, // Stroke width to use
+}) => {
+ // Normalize stroke across designs
+ stroke = stroke * strokeScale
+
+ return (
+
+
+
+ )
+}
+
+/*
+ * SVG elements for the front
+ */
+export const Front = ({ stroke }) => (
+ <>
+
+
+
+ >
+)
+
+/*
+ * SVG elements for the back
+ */
+const Back = ({ stroke }) => (
+ <>
+
+
+
+ >
+)
diff --git a/sites/shared/components/designs/linedrawings/lumira.mjs b/sites/shared/components/designs/linedrawings/lumira.mjs
new file mode 100644
index 00000000000..41706cb2fde
--- /dev/null
+++ b/sites/shared/components/designs/linedrawings/lumira.mjs
@@ -0,0 +1,178 @@
+import { LineDrawingWrapper, thin, dashed } from './shared.mjs'
+
+const strokeScale = 0.5
+
+export const Lumira = ({
+ className = 'w-64', // CSS classes to apply
+ stroke = 1, // Stroke width to use
+}) => {
+ // Normalize stroke across designs
+ stroke = stroke * strokeScale
+
+ return (
+
+
+
+
+ )
+}
+
+/*
+ * React component for the front
+ */
+export const LumiraFront = ({
+ className = 'w-64', // CSS classes to apply
+ stroke = 1, // Stroke width to use
+}) => {
+ // Normalize stroke across designs
+ stroke = stroke * strokeScale
+
+ return (
+
+
+
+ )
+}
+
+/*
+ * React component for the back
+ */
+export const LumiraBack = ({
+ className = 'w-64', // CSS classes to apply
+ stroke = 1, // Stroke width to use
+}) => {
+ // Normalize stroke across designs
+ stroke = stroke * strokeScale
+
+ return (
+
+
+
+ )
+}
+
+/*
+ * SVG elements for the front
+ */
+export const Front = ({ stroke }) => (
+ <>
+
+
+
+ >
+)
+
+/*
+ * SVG elements for the back
+ */
+const Back = ({ stroke }) => (
+ <>
+
+
+
+ >
+)