--- title: "Vertical Timeline Default Design" url: https://cooltimeline.com/demo/vertical-timeline-default/ date: 2025-11-03 modified: 2026-09-18 lang: en author: "cpsatinder" description: "Vertical Timeline (Default Design) Vertical Timeline Layout (Default Design) Explore this default vertical timeline demo displaying stories from top to bottom, with a vertical timeline shortcode option to add the..." image: https://cooltimeline.com/wp-content/uploads/2025/12/vertical_timeline_default_pro.jpg word_count: 259 --- # Vertical Timeline Default Design **Vertical Timeline (Default Design) ** # Vertical Timeline Layout (Default Design) Explore this default vertical timeline demo displaying stories from top to bottom, with a [vertical timeline shortcode](https://cooltimeline.com/doc/vertical-timeline-shortcode/) option to add the same layout anywhere on your website. ![cool-timeline](https://cooltimeline.com/wp-content/uploads/2025/10/icon-cool-timeline-150x150.png) ### Cool Timeline Pro [ Deafult ](/demo/vertical-timeline-default/) [ Flat ](/demo/vertical-timeline-flat/) [ Classic ](/demo/vertical-timeline-classic/) [ Elegant ](/demo/vertical-timeline-elegant/) [ Clean ](/demo/vertical-timeline-clean/) [ Modern ](/demo/vertical-timeline-modern/) [ Minimal ](/demo/vertical-timeline-minimal/) [ Buy Plugin ](/plugin/cool-timeline-pro/#pricing) Default Skin Dark Skin Light Skin #### Default Skin- (Default Design) Step 1 [Cleanse Skin](https://cooltimeline.com/timeline/cleanse-skin/)[![face-cleanser](https://cooltimeline.com/wp-content/uploads/2026/01/face-cleanser.jpg)](https://cooltimeline.com/wp-content/uploads/2026/01/face-cleanser.jpg)Start with a gentle cleanser to remove dirt, oil, sweat, and makeup from your skin. Cleansing helps keep pores clean and prepares your skin for the next steps. Use a mild cleanser that suits your skin type and avoid harsh rubbing. Step 2 [Exfoliate Gently](https://cooltimeline.com/timeline/exfoliate-gently/)[![Exfoliation](https://cooltimeline.com/wp-content/uploads/2026/01/Exfoliation.jpg)](https://cooltimeline.com/wp-content/uploads/2026/01/Exfoliation.jpg)Exfoliation removes dead skin cells and helps improve skin texture and glow. Use a mild exfoliator 2–3 times a week, not daily. This step helps skincare products absorb better and keeps skin looking fresh and smooth. Step 3 [Balance with Toner](https://cooltimeline.com/timeline/balance-with-toner/)[![Toner](https://cooltimeline.com/wp-content/uploads/2026/01/Toner.jpg)](https://cooltimeline.com/wp-content/uploads/2026/01/Toner.jpg)Toner helps balance the skin’s pH and removes any leftover impurities after cleansing. It also refreshes the skin and prepares it for serums or treatments. Choose an alcohol-free toner to avoid dryness or irritation. Step 4 [Boost with Essence](https://cooltimeline.com/timeline/boost-with-essence/)[![Essence](https://cooltimeline.com/wp-content/uploads/2026/01/Essence.jpg)](https://cooltimeline.com/wp-content/uploads/2026/01/Essence.jpg)Essence adds lightweight hydration and supports skin repair. It helps improve skin softness and boosts moisture levels without feeling heavy. Gently pat it into the skin to help with better absorption and overall skin comfort. Page 1 of 3 1 [2](https://cooltimeline.com/demo/vertical-timeline-default/page/2/) [3](https://cooltimeline.com/demo/vertical-timeline-default/page/3/) [**](https://cooltimeline.com/demo/vertical-timeline-default/page/2/) **Shortcode** (Above timeline uses this shortcode) :- ` [[cool-timeline layout="default" designs="design-1" skin="default" category="skin-care" based="custom" story-content="short" show-posts="4" start-on="0" compact-ele-pos="main-date" animations="fade-up" order="ASC" story-date="show" date-format="F j" icons="icon" pagination="default" pagination-style="style-1" filters="no" line-filling="true" read-more="show" content-length="50" timeline-width="custom" timeline-custom-width="1140" show-title="show" title-link="enable" equal-height="false" show-image="show" image-size="large"]] ` #### Dark Skin - (Default Design) Step 1 [Cleanse Skin](https://cooltimeline.com/timeline/cleanse-skin/)[![face-cleanser](https://cooltimeline.com/wp-content/uploads/2026/01/face-cleanser.jpg)](https://cooltimeline.com/wp-content/uploads/2026/01/face-cleanser.jpg)Start with a gentle cleanser to remove dirt, oil, sweat, and makeup from your skin. Cleansing helps keep pores clean and prepares your skin for the next steps. Use a mild cleanser that suits your skin type and avoid harsh rubbing. Step 2 [Exfoliate Gently](https://cooltimeline.com/timeline/exfoliate-gently/)[![Exfoliation](https://cooltimeline.com/wp-content/uploads/2026/01/Exfoliation.jpg)](https://cooltimeline.com/wp-content/uploads/2026/01/Exfoliation.jpg)Exfoliation removes dead skin cells and helps improve skin texture and glow. Use a mild exfoliator 2–3 times a week, not daily. This step helps skincare products absorb better and keeps skin looking fresh and smooth. Step 3 [Balance with Toner](https://cooltimeline.com/timeline/balance-with-toner/)[![Toner](https://cooltimeline.com/wp-content/uploads/2026/01/Toner.jpg)](https://cooltimeline.com/wp-content/uploads/2026/01/Toner.jpg)Toner helps balance the skin’s pH and removes any leftover impurities after cleansing. It also refreshes the skin and prepares it for serums or treatments. Choose an alcohol-free toner to avoid dryness or irritation. Step 4 [Boost with Essence](https://cooltimeline.com/timeline/boost-with-essence/)[![Essence](https://cooltimeline.com/wp-content/uploads/2026/01/Essence.jpg)](https://cooltimeline.com/wp-content/uploads/2026/01/Essence.jpg)Essence adds lightweight hydration and supports skin repair. It helps improve skin softness and boosts moisture levels without feeling heavy. Gently pat it into the skin to help with better absorption and overall skin comfort. Page 1 of 3 1 [2](https://cooltimeline.com/demo/vertical-timeline-default/page/2/) [3](https://cooltimeline.com/demo/vertical-timeline-default/page/3/) [**](https://cooltimeline.com/demo/vertical-timeline-default/page/2/) **Shortcode** (Above timeline uses this shortcode) :- ` [[cool-timeline layout="default" designs="design-1" skin="dark" category="skin-care" based="custom" story-content="short" show-posts="4" start-on="0" compact-ele-pos="main-date" animations="fade-up" order="ASC" story-date="show" date-format="F j" icons="icon" pagination="default" pagination-style="style-1" filters="no" line-filling="true" read-more="show" content-length="50" timeline-width="custom" timeline-custom-width="1140" show-title="show" title-link="enable" equal-height="false" show-image="show" image-size="large"]] ` #### Light Skin (Default Design) Step 1 [Cleanse Skin](https://cooltimeline.com/timeline/cleanse-skin/)[![face-cleanser](https://cooltimeline.com/wp-content/uploads/2026/01/face-cleanser.jpg)](https://cooltimeline.com/wp-content/uploads/2026/01/face-cleanser.jpg)Start with a gentle cleanser to remove dirt, oil, sweat, and makeup from your skin. Cleansing helps keep pores clean and prepares your skin for the next steps. Use a mild cleanser that suits your skin type and avoid harsh rubbing. Step 2 [Exfoliate Gently](https://cooltimeline.com/timeline/exfoliate-gently/)[![Exfoliation](https://cooltimeline.com/wp-content/uploads/2026/01/Exfoliation.jpg)](https://cooltimeline.com/wp-content/uploads/2026/01/Exfoliation.jpg)Exfoliation removes dead skin cells and helps improve skin texture and glow. Use a mild exfoliator 2–3 times a week, not daily. This step helps skincare products absorb better and keeps skin looking fresh and smooth. Step 3 [Balance with Toner](https://cooltimeline.com/timeline/balance-with-toner/)[![Toner](https://cooltimeline.com/wp-content/uploads/2026/01/Toner.jpg)](https://cooltimeline.com/wp-content/uploads/2026/01/Toner.jpg)Toner helps balance the skin’s pH and removes any leftover impurities after cleansing. It also refreshes the skin and prepares it for serums or treatments. Choose an alcohol-free toner to avoid dryness or irritation. Step 4 [Boost with Essence](https://cooltimeline.com/timeline/boost-with-essence/)[![Essence](https://cooltimeline.com/wp-content/uploads/2026/01/Essence.jpg)](https://cooltimeline.com/wp-content/uploads/2026/01/Essence.jpg)Essence adds lightweight hydration and supports skin repair. It helps improve skin softness and boosts moisture levels without feeling heavy. Gently pat it into the skin to help with better absorption and overall skin comfort. Page 1 of 3 1 [2](https://cooltimeline.com/demo/vertical-timeline-default/page/2/) [3](https://cooltimeline.com/demo/vertical-timeline-default/page/3/) [**](https://cooltimeline.com/demo/vertical-timeline-default/page/2/) **Shortcode** (Above timeline uses this shortcode) :- ` [[cool-timeline layout="default" designs="design-1" skin="light" category="skin-care" based="custom" story-content="short" show-posts="4" start-on="0" compact-ele-pos="main-date" animations="fade-up" order="ASC" story-date="show" date-format="F j" icons="icon" pagination="default" pagination-style="style-1" filters="no" line-filling="true" read-more="show" content-length="50" timeline-width="custom" timeline-custom-width="1140" show-title="show" title-link="enable" equal-height="false" show-image="show" image-size="large"]] `