diff --git a/packages/core/package.json b/packages/core/package.json
index 609f00e2d0..651ac1006c 100644
--- a/packages/core/package.json
+++ b/packages/core/package.json
@@ -39,6 +39,7 @@
     "react-dom": "^16.12.0",
     "react-helmet": "5.2.1",
     "react-router-dom": "^5.1.2",
+    "react-sparklines": "^1.7.0",
     "recompose": "0.30.0"
   },
   "devDependencies": {
@@ -49,6 +50,7 @@
     "@testing-library/jest-dom": "^4.2.4",
     "@testing-library/react": "^9.3.2",
     "@testing-library/user-event": "^7.1.2",
+    "@types/react-sparklines": "^1.7.0",
     "react-router": "^5.1.2"
   },
   "peerDependencies": {
diff --git a/packages/core/src/components/Lifecycle/LifecycleAlpha.stories.tsx b/packages/core/src/components/Lifecycle/LifecycleAlpha.stories.tsx
index 1b044fcd5f..072fb90a55 100644
--- a/packages/core/src/components/Lifecycle/LifecycleAlpha.stories.tsx
+++ b/packages/core/src/components/Lifecycle/LifecycleAlpha.stories.tsx
@@ -17,7 +17,7 @@ import React from 'react';
 import { AlphaLabel } from './Lifecycle';
 
 export default {
-  title: 'Alpha Lifecycle',
+  title: 'Lifecycle - Alpha',
   component: AlphaLabel,
 };
 
diff --git a/packages/core/src/components/Lifecycle/LifecycleBeta.stories.tsx b/packages/core/src/components/Lifecycle/LifecycleBeta.stories.tsx
index b74171b5ea..f8cce2a562 100644
--- a/packages/core/src/components/Lifecycle/LifecycleBeta.stories.tsx
+++ b/packages/core/src/components/Lifecycle/LifecycleBeta.stories.tsx
@@ -17,7 +17,7 @@ import React from 'react';
 import { BetaLabel } from './Lifecycle';
 
 export default {
-  title: 'Beta Lifecycle',
+  title: 'Lifecycle - Beta',
   component: BetaLabel,
 };
 
diff --git a/packages/core/src/components/TrendLine/TrendLine.stories.tsx b/packages/core/src/components/TrendLine/TrendLine.stories.tsx
new file mode 100644
index 0000000000..855b14207c
--- /dev/null
+++ b/packages/core/src/components/TrendLine/TrendLine.stories.tsx
@@ -0,0 +1,43 @@
+/*
+ * Copyright 2020 Spotify AB
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+import React from 'react';
+import TrendLine from '.';
+
+export default {
+  title: 'TrendLine',
+  component: TrendLine,
+};
+
+const width = 140;
+
+export const Default = () => (
+  <div style={{ width }}>
+    <TrendLine data={[0.1, 0.7, 0.5, 0.8]} title="Trend over time" />
+  </div>
+);
+
+export const TrendingUp = () => (
+  <div style={{ width }}>
+    <TrendLine data={[0.1, 0.5, 0.9, 1.0]} title="Trend over time" />
+  </div>
+);
+
+export const TrendingDown = () => (
+  <div style={{ width }}>
+    <TrendLine data={[0.8, 0.7, 0.5, 0.1]} title="Trend over time" />
+  </div>
+);
diff --git a/plugins/lighthouse/src/components/CategoryTrendline/index.test.tsx b/packages/core/src/components/TrendLine/TrendLine.test.tsx
similarity index 77%
rename from plugins/lighthouse/src/components/CategoryTrendline/index.test.tsx
rename to packages/core/src/components/TrendLine/TrendLine.test.tsx
index c45db58b9e..985e5d2b31 100644
--- a/plugins/lighthouse/src/components/CategoryTrendline/index.test.tsx
+++ b/packages/core/src/components/TrendLine/TrendLine.test.tsx
@@ -15,18 +15,17 @@
  */
 
 /* eslint-disable jest/no-disabled-tests */
-
 import React from 'react';
 import { render } from '@testing-library/react';
 import { wrapInThemedTestApp } from '@backstage/test-utils';
 
-import CategoryTrendline from '.';
+import TrendLine from '.';
 
-describe('CategoryTrendline', () => {
+describe('TrendLine', () => {
   describe('when no data is present', () => {
     it('renders null without throwing', () => {
       const rendered = render(
-        wrapInThemedTestApp(<CategoryTrendline data={[]} title="sparkline" />),
+        wrapInThemedTestApp(<TrendLine data={[]} title="sparkline" />),
       );
       expect(rendered.queryByTitle('sparkline')).not.toBeInTheDocument();
     });
@@ -35,9 +34,7 @@ describe('CategoryTrendline', () => {
   describe('when one datapoint is present', () => {
     it('renders as a straight line', () => {
       const rendered = render(
-        wrapInThemedTestApp(
-          <CategoryTrendline data={[0.5]} title="sparkline" />,
-        ),
+        wrapInThemedTestApp(<TrendLine data={[0.5]} title="sparkline" />),
       );
       expect(rendered.getByTitle('sparkline')).toBeInTheDocument();
     });
@@ -46,9 +43,7 @@ describe('CategoryTrendline', () => {
   describe.skip('when the data finishes above the success threshold', () => {
     it('renders with the correct color', () => {
       const rendered = render(
-        wrapInThemedTestApp(
-          <CategoryTrendline data={[0.5, 0.95]} title="sparkline" />,
-        ),
+        wrapInThemedTestApp(<TrendLine data={[0.5, 0.95]} title="sparkline" />),
       );
       expect(rendered.getByTitle('sparkline')).toBeInTheDocument();
     });
@@ -57,9 +52,7 @@ describe('CategoryTrendline', () => {
   describe.skip('when the data finishes within the the warning threshold', () => {
     it('renders with the correct color', () => {
       const rendered = render(
-        wrapInThemedTestApp(
-          <CategoryTrendline data={[0.5, 0.65]} title="sparkline" />,
-        ),
+        wrapInThemedTestApp(<TrendLine data={[0.5, 0.65]} title="sparkline" />),
       );
       expect(rendered.getByTitle('sparkline')).toBeInTheDocument();
     });
@@ -68,9 +61,7 @@ describe('CategoryTrendline', () => {
   describe.skip('when the data finishes within the the error threshold', () => {
     it('renders with the correct color', () => {
       const rendered = render(
-        wrapInThemedTestApp(
-          <CategoryTrendline data={[0.5, 0.4]} title="sparkline" />,
-        ),
+        wrapInThemedTestApp(<TrendLine data={[0.5, 0.4]} title="sparkline" />),
       );
       expect(rendered.getByTitle('sparkline')).toBeInTheDocument();
     });
diff --git a/plugins/lighthouse/src/components/CategoryTrendline/index.tsx b/packages/core/src/components/TrendLine/TrendLine.tsx
similarity index 92%
rename from plugins/lighthouse/src/components/CategoryTrendline/index.tsx
rename to packages/core/src/components/TrendLine/TrendLine.tsx
index e3dbd186e0..3ab9b67e53 100644
--- a/plugins/lighthouse/src/components/CategoryTrendline/index.tsx
+++ b/packages/core/src/components/TrendLine/TrendLine.tsx
@@ -13,6 +13,7 @@
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
+
 import React, { FC } from 'react';
 import { Sparklines, SparklinesLine, SparklinesProps } from 'react-sparklines';
 import { useTheme } from '@material-ui/core';
@@ -26,7 +27,7 @@ function color(data: number[], theme: BackstageTheme): string | undefined {
   return theme.palette.status.error;
 }
 
-const CategoryTrendline: FC<SparklinesProps & { title?: string }> = props => {
+const Trendline: FC<SparklinesProps & { title?: string }> = props => {
   const theme = useTheme<BackstageTheme>();
 
   if (!props.data) return null;
@@ -38,4 +39,4 @@ const CategoryTrendline: FC<SparklinesProps & { title?: string }> = props => {
   );
 };
 
-export default CategoryTrendline;
+export default Trendline;
diff --git a/packages/core/src/components/TrendLine/index.ts b/packages/core/src/components/TrendLine/index.ts
new file mode 100644
index 0000000000..168c6e6d3f
--- /dev/null
+++ b/packages/core/src/components/TrendLine/index.ts
@@ -0,0 +1,17 @@
+/*
+ * Copyright 2020 Spotify AB
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+export { default } from './TrendLine';
diff --git a/packages/core/src/index.ts b/packages/core/src/index.ts
index 9153b9fa3b..a13146991c 100644
--- a/packages/core/src/index.ts
+++ b/packages/core/src/index.ts
@@ -31,6 +31,7 @@ export { default as Progress } from './components/Progress';
 export { AlphaLabel, BetaLabel } from './components/Lifecycle';
 export { default as SupportButton } from './components/SupportButton';
 export { default as SortableTable } from './components/SortableTable';
+export { default as TrendLine } from './components/TrendLine';
 export { FeatureCalloutCircular } from './components/FeatureDiscovery/FeatureCalloutCircular';
 export * from './components/Status';
 export { default as WarningPanel } from './components/WarningPanel';
diff --git a/plugins/lighthouse/package.json b/plugins/lighthouse/package.json
index 442211a38c..d082b0be0f 100644
--- a/plugins/lighthouse/package.json
+++ b/plugins/lighthouse/package.json
@@ -13,8 +13,7 @@
     "clean": "backstage-cli clean"
   },
   "dependencies": {
-    "react-markdown": "^4.3.1",
-    "react-sparklines": "^1.7.0"
+    "react-markdown": "^4.3.1"
   },
   "devDependencies": {
     "@backstage/cli": "^0.1.1-alpha.4",
@@ -29,7 +28,6 @@
     "@testing-library/user-event": "^7.1.2",
     "@types/jest": "^24.0.0",
     "@types/node": "^12.0.0",
-    "@types/react-sparklines": "^1.7.0",
     "@types/testing-library__jest-dom": "5.0.2",
     "jest-fetch-mock": "^3.0.3",
     "react": "^16.13.1",
diff --git a/plugins/lighthouse/src/components/AuditList/AuditListTable.tsx b/plugins/lighthouse/src/components/AuditList/AuditListTable.tsx
index 52f3eeb5e2..ba0e79f066 100644
--- a/plugins/lighthouse/src/components/AuditList/AuditListTable.tsx
+++ b/plugins/lighthouse/src/components/AuditList/AuditListTable.tsx
@@ -24,6 +24,7 @@ import {
   TableRow,
 } from '@material-ui/core';
 import { makeStyles } from '@material-ui/core/styles';
+import { TrendLine } from '@backstage/core';
 
 import {
   Audit,
@@ -32,7 +33,6 @@ import {
   Website,
 } from '../../api';
 import { formatTime } from '../../utils';
-import CategoryTrendline from '../CategoryTrendline';
 import AuditStatusIcon from '../AuditStatusIcon';
 
 export const CATEGORIES: LighthouseCategoryId[] = [
@@ -132,7 +132,7 @@ export const AuditListTable: FC<{ items: Website[] }> = ({ items }) => {
                   key={`${website.url}|${category}`}
                   className={classes.sparklinesCell}
                 >
-                  <CategoryTrendline
+                  <TrendLine
                     title={`trendline for ${CATEGORY_LABELS[category]} category of ${website.url}`}
                     data={categorySparklines[website.url][category] || []}
                   />