SenangStart Loading... [ Back to Sections ](https://senangstart.com/sections/all) showcase 18 [ Alternating Experiences ](https://senangstart.com/sections/experiences-1) [ App Screenshot Previews ](https://senangstart.com/sections/previews-2) [ Award Showcase Grid ](https://senangstart.com/sections/awards-1) [ Bonus Content Grid ](https://senangstart.com/sections/bonus-1) [ Course Card Grid ](https://senangstart.com/sections/blogs-2) [ Course Offer Cards ](https://senangstart.com/sections/offer-2) [ Custom Section Benefits ](https://senangstart.com/sections/benefits-1) [ Dual Product Cards ](https://senangstart.com/sections/products-3) [ Filterable Portfolio ](https://senangstart.com/sections/products-4) [ Offer Image Grid ](https://senangstart.com/sections/offer-1) [ Partners & Clients ](https://senangstart.com/sections/partners-clients) [ Portfolio Reveal Grid ](https://senangstart.com/sections/products-1) [ Quality Asym Images ](https://senangstart.com/sections/quality-1) [ STEM Learning Previews ](https://senangstart.com/sections/previews-1) [ Service Icon Grid ](https://senangstart.com/sections/services-1) [ Specialty Icon Grid ](https://senangstart.com/sections/specialities-1) [ Template Showcase Grid ](https://senangstart.com/sections/products-2) [ Webinar Grid ](https://senangstart.com/sections/blogs-1) cta 7 [ App Download CTA ](https://senangstart.com/sections/cta-2) [ CTA Profile Card ](https://senangstart.com/sections/cta-1) [ CTA Stats & Image ](https://senangstart.com/sections/cta-5) [ Newsletter CTA Logos ](https://senangstart.com/sections/cta-6) [ Plan CTA Testimonial ](https://senangstart.com/sections/cta-7) [ Product CTA Interactive ](https://senangstart.com/sections/cta-3) [ Profile CTA Background ](https://senangstart.com/sections/cta-4) feature 4 [ App Features Centered ](https://senangstart.com/sections/features-2) [ App Features Mobile ](https://senangstart.com/sections/features-1) [ Feature Image Toggle ](https://senangstart.com/sections/features-4) [ Feature Large Image ](https://senangstart.com/sections/features-3) general 4 [ App Onboarding Steps ](https://senangstart.com/sections/steps-2) [ Event Timeline ](https://senangstart.com/sections/timeline-1) [ Step Image Cards ](https://senangstart.com/sections/steps-1) [ Story Mission Banners ](https://senangstart.com/sections/story-1) testimonial 4 [ Basic Testimonial Grid ](https://senangstart.com/sections/testimony-2) [ Simple Testimonial ](https://senangstart.com/sections/testimony-1) [ Testimonial Cards Stats ](https://senangstart.com/sections/testimony-4) [ Testimonial Slider ](https://senangstart.com/sections/testimony-3) video 6 [ Centered Video Show ](https://senangstart.com/sections/video-1) [ Video Feature Highlights ](https://senangstart.com/sections/video-6) [ Video Fullwidth Overlay ](https://senangstart.com/sections/video-2) [ Video Gallery ](https://senangstart.com/sections/video-4) [ Video Testimonial ](https://senangstart.com/sections/video-5) [ Video with Sidebar ](https://senangstart.com/sections/video-3) problem 6 [ Challenge Icon Cards ](https://senangstart.com/sections/problems-3) [ Dual Problem Cards ](https://senangstart.com/sections/problems-1) [ Multi-Format Problems ](https://senangstart.com/sections/problems-2) [ Problem Before/After ](https://senangstart.com/sections/problems-4) [ Problem Image Stack ](https://senangstart.com/sections/problems-6) [ Tabbed Problem Explore ](https://senangstart.com/sections/problems-5) faq 6 [ Classic Accordion ](https://senangstart.com/sections/faq-1) [ Colored Block FAQ ](https://senangstart.com/sections/faq-4) [ Formal List FAQ ](https://senangstart.com/sections/faq-6) [ Grid Toggle FAQ ](https://senangstart.com/sections/faq-2) [ Interactive List FAQ ](https://senangstart.com/sections/faq-5) [ Sidebar Intro FAQ ](https://senangstart.com/sections/faq-3) product 2 [ Course Product Page ](https://senangstart.com/sections/product-1) [ Webinar Product Booking ](https://senangstart.com/sections/product-2) footer 2 [ Footer Sitemap ](https://senangstart.com/sections/footer-2) [ Simple Footer Social ](https://senangstart.com/sections/footer-1) story 5 [ Founder's Perspective ](https://senangstart.com/sections/story-4) [ Guiding Core Values ](https://senangstart.com/sections/story-3) [ Our Journey Timeline ](https://senangstart.com/sections/story-2) [ Our Working Philosophy ](https://senangstart.com/sections/story-5) [ The Evolution Story ](https://senangstart.com/sections/story-6) statistic 6 [ Global Scale Stats ](https://senangstart.com/sections/statistics-6) [ Impact Highlights ](https://senangstart.com/sections/statistics-4) [ Key Metrics Showcase ](https://senangstart.com/sections/statistics-2) [ Milestone Cards ](https://senangstart.com/sections/statistics-5) [ Progress Report List ](https://senangstart.com/sections/statistics-3) [ Statistic Box Grid ](https://senangstart.com/sections/statistics-1) hero 6 [ Hero BG Pattern Card ](https://senangstart.com/sections/hero-6) [ Hero Centered Media ](https://senangstart.com/sections/hero-1) [ Hero Feature Cards ](https://senangstart.com/sections/hero-5) [ Hero Full BG Image ](https://senangstart.com/sections/hero-3) [ Hero Split BG Image ](https://senangstart.com/sections/hero-2) [ Hero Split Overlay ](https://senangstart.com/sections/hero-4) team 2 [ Medical Team Grid ](https://senangstart.com/sections/team-2) [ Team Leadership Grid ](https://senangstart.com/sections/team-1) navigation 6 [ Navbar Announce User ](https://senangstart.com/sections/navbar-6) [ Navbar Mega Menu ](https://senangstart.com/sections/navbar-5) [ Navbar Prev/Next Nav ](https://senangstart.com/sections/navbar-2) [ Navbar Top Bar Links ](https://senangstart.com/sections/navbar-3) [ Navbar with Search ](https://senangstart.com/sections/navbar-4) [ Standard Navbar ](https://senangstart.com/sections/navbar-1) pricing 2 [ Pricing Compare Table ](https://senangstart.com/sections/pricing-2) [ Pricing Toggle Cards ](https://senangstart.com/sections/pricing-1) [![SenangStart](https://senangstart.com/img/ss_logo_text.svg)](https://senangstart.com) #### [\#](https://senangstart.com/sections/previews-1/llms.txt)STEM Learning Previews showcase Presents STEM learning topics with engaging visuals and descriptions, featuring interactive image previews. TailwindCSS SenangStart CSS 📖 Learning STEM Topics ====================== Science Eclipse An eclipse takes place when one heavenly body such as a moon or planet moves into the shadow of another heavenly body. ![](https://placehold.co/400x400/2563EB/FFFFFF) ![](https://placehold.co/400x160) ![](https://placehold.co/400x400/2563EB/FFFFFF) ![](https://placehold.co/400x160) Technology Augmented Reality Thanks to augmented reality technology, digital objects can exist outside of the digital world and come into our world. Engineering Combustion Engines Internal combustion engines (ICE) are the most common form of heat engines, as they are used in vehicles, boats, ships, airplanes, and trains. ![](https://placehold.co/400x400/2563EB/FFFFFF) ![](https://placehold.co/400x160) ![](https://placehold.co/400x400/2563EB/FFFFFF) ![](https://placehold.co/400x160) Mathematics Dimensions Dimensions are used to describe the size and shape of an object. For example: length, width, height, etc. <section class="container mx-auto my-8 px-6 lg:my-16 lg:px-16"> <h1 class="mb-8 text-center text-3xl font-bold lg:mx-24 lg:mb-16 lg:text-6xl">📖 Learning STEM Topics</h1> <div class="flex flex-col gap-8 lg:gap-16"> <div class="flex flex-col lg:mx-24"> <div class="group grid gap-8 lg:grid-cols-2 lg:gap-16"> <div class="order-2 flex flex-col justify-center gap-4 lg:order-1 lg:gap-8"> <div class="max-w-max rounded-md bg-blue-600 px-2 font-bold text-white">Science</div> <p class="text-2xl font-bold lg:text-4xl">Eclipse</p> <p class="text-xl lg:text-2xl">An eclipse takes place when one heavenly body such as a moon or planet moves into the shadow of another heavenly body.<br /></p> </div> <div class="order-1 flex flex-col items-center lg:order-2"> <img src="https://placehold.co/400x400/2563EB/FFFFFF" class="w-full max-w-md object-contain duration-500 ease-in-out group-hover:scale-150" /> <img src="https://placehold.co/400x160" class="w-full max-w-sm object-contain" /> </div> </div> </div> <div class="flex flex-col lg:mx-24"> <div class="group grid gap-8 lg:grid-cols-2 lg:gap-16"> <div class="flex flex-col items-center"> <img src="https://placehold.co/400x400/2563EB/FFFFFF" class="w-full max-w-md object-contain duration-500 ease-in-out group-hover:scale-150" /> <img src="https://placehold.co/400x160" class="w-full max-w-sm object-contain" /> </div> <div class="flex flex-col justify-center gap-4 lg:gap-8"> <div class="max-w-max rounded-md bg-blue-600 px-2 font-bold text-white">Technology</div> <p class="text-2xl font-bold lg:text-4xl">Augmented Reality<br /></p> <p class="text-xl lg:text-2xl">Thanks to augmented reality technology, digital objects can exist outside of the digital world and come into our world.<br /></p> </div> </div> </div> <div class="flex flex-col lg:mx-24"> <div class="group grid gap-8 lg:grid-cols-2 lg:gap-16"> <div class="order-2 flex flex-col justify-center gap-4 lg:order-1 lg:gap-8"> <div class="max-w-max rounded-md bg-blue-600 px-2 font-bold text-white">Engineering</div> <p class="text-2xl font-bold lg:text-4xl">Combustion Engines<br /></p> <p class="text-xl lg:text-2xl">Internal combustion engines (ICE) are the most common form of heat engines, as they are used in vehicles, boats, ships, airplanes, and trains.<br /></p> </div> <div class="order-1 flex flex-col items-center lg:order-2"> <img src="https://placehold.co/400x400/2563EB/FFFFFF" class="w-full max-w-md object-contain duration-500 ease-in-out group-hover:scale-150" /> <img src="https://placehold.co/400x160" class="w-full max-w-sm object-contain" /> </div> </div> </div> <div class="flex flex-col lg:mx-24"> <div class="group grid gap-8 lg:grid-cols-2 lg:gap-16"> <div class="flex flex-col items-center"> <img src="https://placehold.co/400x400/2563EB/FFFFFF" class="w-full max-w-md object-contain duration-500 ease-in-out group-hover:scale-150" /> <img src="https://placehold.co/400x160" class="w-full max-w-sm object-contain" /> </div> <div class="flex flex-col justify-center gap-4 lg:gap-8"> <div class="max-w-max rounded-md bg-blue-600 px-2 font-bold text-white">Mathematics</div> <p class="text-2xl font-bold lg:text-4xl">Dimensions<br /></p> <p class="text-xl lg:text-2xl">Dimensions are used to describe the size and shape of an object. For example: length, width, height, etc.<br /></p> </div> </div> </div> </div> </section> COPY ```

📖 Learning STEM Topics

Science

Eclipse

An eclipse takes place when one heavenly body such as a moon or planet moves into the shadow of another heavenly body.

Technology

Augmented Reality

Thanks to augmented reality technology, digital objects can exist outside of the digital world and come into our world.

Engineering

Combustion Engines

Internal combustion engines (ICE) are the most common form of heat engines, as they are used in vehicles, boats, ships, airplanes, and trains.

Mathematics

Dimensions

Dimensions are used to describe the size and shape of an object. For example: length, width, height, etc.

``` 📖 Learning STEM Topics ====================== Science Eclipse An eclipse takes place when one heavenly body such as a moon or planet moves into the shadow of another heavenly body. ![](https://placehold.co/400x400/2563EB/FFFFFF) ![](https://placehold.co/400x160) ![](https://placehold.co/400x400/2563EB/FFFFFF) ![](https://placehold.co/400x160) Technology Augmented Reality Thanks to augmented reality technology, digital objects can exist outside of the digital world and come into our world. Engineering Combustion Engines Internal combustion engines (ICE) are the most common form of heat engines, as they are used in vehicles, boats, ships, airplanes, and trains. ![](https://placehold.co/400x400/2563EB/FFFFFF) ![](https://placehold.co/400x160) ![](https://placehold.co/400x400/2563EB/FFFFFF) ![](https://placehold.co/400x160) Mathematics Dimensions Dimensions are used to describe the size and shape of an object. For example: length, width, height, etc. <section layout="container" space="m-x:auto m-y:large p-x:medium-3x tw-lg:m-y:big-3x tw-lg:p-x:big-3x"> <h1 space="m-b:large tw-lg:m-x:giant tw-lg:m-b:big-3x" visual="text:center text-size:grand font:tw-bold tw-lg:text-size:mega">📖 Learning STEM Topics</h1> <div layout="flex col" space="g:large tw-lg:g:big-3x"> <div layout="flex col" space="tw-lg:m-x:giant"> <div layout="grid tw-lg:grid-cols:2" space="g:large tw-lg:g:big-3x" class="group"> <div layout="order:2 flex col justify:center tw-lg:order:1" space="g:medium tw-lg:g:large"> <div space="max-w:\[max-content\] p-x:small" visual="rounded:small bg:blue-600 font:tw-bold text:white">Science</div> <p visual="text-size:huge font:tw-bold tw-lg:text-size:giant">Eclipse</p> <p visual="text-size:big tw-lg:text-size:huge">An eclipse takes place when one heavenly body such as a moon or planet moves into the shadow of another heavenly body.<br /></p> </div> <div layout="order:1 flex col items:center tw-lg:order:2"> <img src="https://placehold.co/400x400/2563EB/FFFFFF" layout="object:contain" space="w:\[100%\] max-w:\[md\]" visual="duration:slower ease:in-out" class="group-hover:scale-150" /> <img src="https://placehold.co/400x160" layout="object:contain" space="w:\[100%\] max-w:\[sm\]" /> </div> </div> </div> <div layout="flex col" space="tw-lg:m-x:giant"> <div layout="grid tw-lg:grid-cols:2" space="g:large tw-lg:g:big-3x" class="group"> <div layout="flex col items:center"> <img src="https://placehold.co/400x400/2563EB/FFFFFF" layout="object:contain" space="w:\[100%\] max-w:\[md\]" visual="duration:slower ease:in-out" class="group-hover:scale-150" /> <img src="https://placehold.co/400x160" layout="object:contain" space="w:\[100%\] max-w:\[sm\]" /> </div> <div layout="flex col justify:center" space="g:medium tw-lg:g:large"> <div space="max-w:\[max-content\] p-x:small" visual="rounded:small bg:blue-600 font:tw-bold text:white">Technology</div> <p visual="text-size:huge font:tw-bold tw-lg:text-size:giant">Augmented Reality<br /></p> <p visual="text-size:big tw-lg:text-size:huge">Thanks to augmented reality technology, digital objects can exist outside of the digital world and come into our world.<br /></p> </div> </div> </div> <div layout="flex col" space="tw-lg:m-x:giant"> <div layout="grid tw-lg:grid-cols:2" space="g:large tw-lg:g:big-3x" class="group"> <div layout="order:2 flex col justify:center tw-lg:order:1" space="g:medium tw-lg:g:large"> <div space="max-w:\[max-content\] p-x:small" visual="rounded:small bg:blue-600 font:tw-bold text:white">Engineering</div> <p visual="text-size:huge font:tw-bold tw-lg:text-size:giant">Combustion Engines<br /></p> <p visual="text-size:big tw-lg:text-size:huge">Internal combustion engines (ICE) are the most common form of heat engines, as they are used in vehicles, boats, ships, airplanes, and trains.<br /></p> </div> <div layout="order:1 flex col items:center tw-lg:order:2"> <img src="https://placehold.co/400x400/2563EB/FFFFFF" layout="object:contain" space="w:\[100%\] max-w:\[md\]" visual="duration:slower ease:in-out" class="group-hover:scale-150" /> <img src="https://placehold.co/400x160" layout="object:contain" space="w:\[100%\] max-w:\[sm\]" /> </div> </div> </div> <div layout="flex col" space="tw-lg:m-x:giant"> <div layout="grid tw-lg:grid-cols:2" space="g:large tw-lg:g:big-3x" class="group"> <div layout="flex col items:center"> <img src="https://placehold.co/400x400/2563EB/FFFFFF" layout="object:contain" space="w:\[100%\] max-w:\[md\]" visual="duration:slower ease:in-out" class="group-hover:scale-150" /> <img src="https://placehold.co/400x160" layout="object:contain" space="w:\[100%\] max-w:\[sm\]" /> </div> <div layout="flex col justify:center" space="g:medium tw-lg:g:large"> <div space="max-w:\[max-content\] p-x:small" visual="rounded:small bg:blue-600 font:tw-bold text:white">Mathematics</div> <p visual="text-size:huge font:tw-bold tw-lg:text-size:giant">Dimensions<br /></p> <p visual="text-size:big tw-lg:text-size:huge">Dimensions are used to describe the size and shape of an object. For example: length, width, height, etc.<br /></p> </div> </div> </div> </div> </section> COPY ```

📖 Learning STEM Topics

Science

Eclipse

An eclipse takes place when one heavenly body such as a moon or planet moves into the shadow of another heavenly body.

Technology

Augmented Reality

Thanks to augmented reality technology, digital objects can exist outside of the digital world and come into our world.

Engineering

Combustion Engines

Internal combustion engines (ICE) are the most common form of heat engines, as they are used in vehicles, boats, ships, airplanes, and trains.

Mathematics

Dimensions

Dimensions are used to describe the size and shape of an object. For example: length, width, height, etc.

``` SA Senang Assistant Online • Help Center ### Cookie Consent We use cookies to optimize website features, analyze traffic, and enhance your browsing experience. Choose your preferences below. [Privacy Policy](https://senangstart.com/privacy_policy) Accept All Reject All Customize Preferences ### Manage Preferences Strictly Necessary Required Essential for page operation, user login sessions, and secure navigation. Performance & Analytics Allows us to count visits and traffic sources to measure and improve our site performance. Marketing & Targeting Used to understand visitor interests and deliver relevant promotional messages. Save Choices Accept All