diff --git a/common/djangoapps/student/toggles.py b/common/djangoapps/student/toggles.py
new file mode 100644
index 0000000000..9c50bd6290
--- /dev/null
+++ b/common/djangoapps/student/toggles.py
@@ -0,0 +1,24 @@
+"""
+Toggles for Dashboard page.
+"""
+from edx_toggles.toggles import WaffleFlag
+
+
+# Namespace for student waffle flags.
+WAFFLE_FLAG_NAMESPACE = 'student'
+
+# Waffle flag to enable amplitude recommendations
+# .. toggle_name: student.enable_amplitude_recommendations
+# .. toggle_implementation: WaffleFlag
+# .. toggle_default: False
+# .. toggle_description: Supports rollout of a POC for amplitude recommendations.
+# .. toggle_use_cases: temporary
+# .. toggle_creation_date: 2022-06-24
+# .. toggle_target_removal_date: None
+# .. toggle_warning: None
+# .. toggle_tickets: VAN-984
+ENABLE_AMPLITUDE_RECOMMENDATIONS = WaffleFlag(f'{WAFFLE_FLAG_NAMESPACE}.enable_amplitude_recommendations', __name__)
+
+
+def should_show_amplitude_recommendations():
+    return ENABLE_AMPLITUDE_RECOMMENDATIONS.is_enabled()
diff --git a/lms/static/js/learner_dashboard/RecommendationsPanel.jsx b/lms/static/js/learner_dashboard/RecommendationsPanel.jsx
new file mode 100644
index 0000000000..c11561e82c
--- /dev/null
+++ b/lms/static/js/learner_dashboard/RecommendationsPanel.jsx
@@ -0,0 +1,85 @@
+/* global gettext */
+import React from 'react';
+
+class RecommendationsPanel extends React.Component {
+  render() {
+    return (
+      <div className="p-4 panel-background">
+        <div className="recommend-heading mb-4">{gettext('Recommendations for you')}</div>
+        <div className="course-card box-shadow-down-1 bg-white mb-3">
+          <div className="box-shadow-down-1 image-box">
+            <img
+              className="panel-course-img"
+              src="https://source.unsplash.com/lQGJCMY5qcM"
+              alt="course image"
+            />
+          </div>
+          <div className="course-title pl-3">
+            <a href="#" className="course-link">The Chemistry of Life</a>
+          </div>
+        </div>
+        <div className="course-card box-shadow-down-1 bg-white mb-3">
+          <div className="box-shadow-down-1 image-box">
+            <img
+              className="panel-course-img"
+              src="https://source.unsplash.com/KltoLK6Mk-g"
+              alt="course image"
+            />
+          </div>
+          <div className="course-title pl-3">
+            <a href="#" className="course-link">Drug Discovery & Medicinal Chemistry</a>
+          </div>
+        </div>
+        <div className="course-card box-shadow-down-1 bg-white mb-3">
+          <div className="box-shadow-down-1 image-box">
+            <img
+              className="panel-course-img"
+              src="https://source.unsplash.com/_BJVJ4WcV1M"
+              alt="course image"
+            />
+          </div>
+          <div className="course-title pl-3">
+            <a href="#" className="course-link">From Fossil Resources to Biomass: A Chemistry Perspective</a>
+          </div>
+        </div>
+        <div className="course-card box-shadow-down-1 bg-white mb-3">
+          <div className="box-shadow-down-1 image-box">
+            <img
+              className="panel-course-img"
+              src="https://source.unsplash.com/NKhckz9B78c"
+              alt="course image"
+            />
+          </div>
+          <div className="course-title pl-3">
+            <a href="#" className="course-link">Digital Biomaterials</a>
+          </div>
+        </div>
+        <div className="course-card box-shadow-down-1 bg-white mb-3">
+          <div className="box-shadow-down-1 image-box">
+            <img
+              className="panel-course-img"
+              src="https://source.unsplash.com/x649mR6yBIs"
+              alt="course image"
+            />
+          </div>
+          <div className="course-title pl-3">
+            <a href="#" className="course-link">Basic Steps in Magnetic Resonance</a>
+          </div>
+        </div>
+        {this.props.exploreCoursesUrl ? (
+          <div className="d-flex justify-content-center">
+            <a
+              href={this.props.exploreCoursesUrl}
+              className="panel-explore-courses justify-content-center align-items-center"
+            >
+              {gettext('Explore courses')}
+              <span className="icon fa fa-search search-icon" aria-hidden="true" />
+            </a>
+          </div>
+        ) : null}
+      </div>
+    );
+  }
+}
+
+export {RecommendationsPanel};
diff --git a/webpack.common.config.js b/webpack.common.config.js
index 77d3d62156..7aa2d02d10 100644
--- a/webpack.common.config.js
+++ b/webpack.common.config.js
@@ -97,6 +97,7 @@ module.exports = Merge.smart({
             DemographicsCollectionModal: './lms/static/js/demographics_collection/DemographicsCollectionModal.jsx',
             AxiosJwtTokenService: './lms/static/js/jwt_auth/AxiosJwtTokenService.js',
             EnterpriseLearnerPortalModal: './lms/static/js/learner_dashboard/EnterpriseLearnerPortalModal.jsx',
+            RecommendationsPanel: './lms/static/js/learner_dashboard/RecommendationsPanel.jsx',
 
             // Learner Dashboard
             EntitlementFactory: './lms/static/js/learner_dashboard/course_entitlement_factory.js',