Notus Design System PRO by Creative Tim

Features 1

Copied

Time passage

In the years that have passed

I know I should have got more than I have and had, I know that not very nice people have stolen from us a lot, but I also know that people want to hear about Notus Design System PRO.

A growing company

The extension comes with three pre-built pages to help you get started faster. You can change the text and images and you're good to go.

Carefully crafted components
Amazing page examples
Dynamic components

Best Quality

What matters is the people who are sparked by it. And the people who are like offended by it.

Awesome Desgin

Because it's about motivating the doers. Because I’m here to follow my dreams and inspire the world.

Great Performane

There’s nothing I really wanted to do in life that I wasn’t able to get good at. We’re constantly growing.

Fast Development

I always felt like I could do anything. That’s the main thing people are controlled by the force!

Super Fresh

Thoughts- their perception of themselves! They're slowed down by their perception of themselves.

Organized Content

If you're taught you can’t do anything, you won’t do anything. I was taught I could do everything.

<div class="w-full">
    <div class="relative text-center py-20">
       <div class="container mx-auto px-4">
          <div class="mb-12 flex flex-wrap -mx-4 justify-end">
             <div class="px-4 relative w-full lg:w-8/12 text-right">
                <h6 class="mb-2 text-lg font-bold uppercase text-emerald-500">Time passage</h6>
                <h2 class="text-4xl font-bold mt-0 mb-1 text-blueGray-700">In the years that have passed</h2>
                <p class="mt-2 mb-4 text-xl leading-relaxed text-blueGray-400">I know I should have got more than I have and had, I know that not very nice people have stolen from us a lot, but I also know that people want to hear about Notus Design System PRO.</p>
             </div>
          </div>
          <div class="items-center flex flex-wrap -mx-4">
             <div class="mr-auto text-left px-4 relative w-full lg:w-4/12 w-full md:w-8/12">
                <div class="text-lightBlue-500 bg-lightBlue-200 p-3 text-center inline-flex items-center justify-center w-16 h-16 mb-6 shadow-lg rounded-full"><i class="fas fa-rocket text-xl"></i></div>
                <h3 class="text-3xl font-semibold">A growing company</h3>
                <p class="mt-4 text-lg leading-relaxed text-blueGray-500">The extension comes with three pre-built pages to help you get started faster. You can change the text and images and you're good to go.</p>
                <ul class="list-none mt-6">
                   <li class="py-2">
                      <div class="flex items-center">
                         <div><span class="text-lightBlue-500 bg-lightBlue-200 text-xs font-semibold inline-block w-8 h-8 flex items-center justify-center uppercase rounded-full mr-3"><i class="fas fa-fingerprint"></i></span></div>
                         <div>
                            <h4 class="text-blueGray-500">Carefully crafted components</h4>
                         </div>
                      </div>
                   </li>
                   <li class="py-2">
                      <div class="flex items-center">
                         <div><span class="text-lightBlue-500 bg-lightBlue-200 text-xs font-semibold inline-block w-8 h-8 flex items-center justify-center uppercase rounded-full mr-3"><i class="fas fa-pager"></i></span></div>
                         <div>
                            <h4 class="text-blueGray-500">Amazing page examples</h4>
                         </div>
                      </div>
                   </li>
                   <li class="py-2">
                      <div class="flex items-center">
                         <div><span class="text-lightBlue-500 bg-lightBlue-200 text-xs font-semibold inline-block w-8 h-8 flex items-center justify-center uppercase rounded-full mr-3"><i class="far fa-paper-plane"></i></span></div>
                         <div>
                            <h4 class="text-blueGray-500">Dynamic components</h4>
                         </div>
                      </div>
                   </li>
                </ul>
             </div>
             <div class="md:pl-0 px-4 relative w-full lg:w-7/12 w-full md:w-full">
                <div class="flex flex-wrap">
                   <div class="relative w-full md:w-4/12 -ml-8 opacity-90 mb-8 md:mt-2">
                      <div class="bg-teal-500 mt-8 rounded-lg text-left p-6 flex items-start">
                         <div class="flex-1">
                            <div class="text-teal-500 bg-white shadow-lg rounded rounded-full justify-center items-center text-center p-2 mx-auto mb-5 inline-flex w-12 h-12"><i class="fas fa-smile-beam text-xl"></i></div>
                            <h4 class="text-2xl font-semibold leading-normal text-white">Best Quality</h4>
                            <p class="mt-2 text-white">What matters is the people who are sparked by it. And the people who are like offended by it.</p>
                         </div>
                      </div>
                   </div>
                   <div class="relative w-full md:w-4/12 -ml-8 opacity-90 mb-8 md:-mt-4">
                      <div class="bg-red-500 mt-8 rounded-lg text-left p-6 flex items-start">
                         <div class="flex-1">
                            <div class="text-red-500 bg-white shadow-lg rounded rounded-full justify-center items-center text-center p-2 mx-auto mb-5 inline-flex w-12 h-12"><i class="fas fa-rocket text-xl"></i></div>
                            <h4 class="text-2xl font-semibold leading-normal text-white">Awesome Desgin</h4>
                            <p class="mt-2 text-white">Because it's about motivating the doers. Because I’m here to follow my dreams and inspire the world.</p>
                         </div>
                      </div>
                   </div>
                   <div class="relative w-full md:w-4/12 -ml-8 opacity-90 mb-8 md:mt-4">
                      <div class="bg-blueGray-800 mt-8 rounded-lg text-left p-6 flex items-start">
                         <div class="flex-1">
                            <div class="undefined bg-white shadow-lg rounded rounded-full justify-center items-center text-center p-2 mx-auto mb-5 inline-flex w-12 h-12"><i class="fab fa-avianex text-xl"></i></div>
                            <h4 class="text-2xl font-semibold leading-normal text-blueGray-100">Great Performane</h4>
                            <p class="mt-2 text-blueGray-100">There’s nothing I really wanted to do in life that I wasn’t able to get good at. We’re constantly growing.</p>
                         </div>
                      </div>
                   </div>
                   <div class="relative w-full md:w-4/12 -ml-8 opacity-90 mb-8 md:mt-2">
                      <div class="bg-lightBlue-500 mt-8 rounded-lg text-left p-6 flex items-start">
                         <div class="flex-1">
                            <div class="text-lightBlue-500 bg-white shadow-lg rounded rounded-full justify-center items-center text-center p-2 mx-auto mb-5 inline-flex w-12 h-12"><i class=" text-xl"></i></div>
                            <h4 class="text-2xl font-semibold leading-normal text-white">Fast Development</h4>
                            <p class="mt-2 text-white">I always felt like I could do anything. That’s the main thing people are controlled by the force!</p>
                         </div>
                      </div>
                   </div>
                   <div class="relative w-full md:w-4/12 -ml-8 opacity-90 mb-8 md:-mt-4">
                      <div class="bg-orange-500 mt-8 rounded-lg text-left p-6 flex items-start">
                         <div class="flex-1">
                            <div class="text-orange-500 bg-white shadow-lg rounded rounded-full justify-center items-center text-center p-2 mx-auto mb-5 inline-flex w-12 h-12"><i class="fas fa-glasses text-xl"></i></div>
                            <h4 class="text-2xl font-semibold leading-normal text-white">Super Fresh</h4>
                            <p class="mt-2 text-white">Thoughts- their perception of themselves! They're slowed down by their perception of themselves.</p>
                         </div>
                      </div>
                   </div>
                   <div class="relative w-full md:w-4/12 -ml-8 opacity-90 mb-8 md:mt-4">
                      <div class="bg-emerald-500 mt-8 rounded-lg text-left p-6 flex items-start">
                         <div class="flex-1">
                            <div class="text-emerald-500 bg-white shadow-lg rounded rounded-full justify-center items-center text-center p-2 mx-auto mb-5 inline-flex w-12 h-12"><i class="fas fa-sitemap text-xl"></i></div>
                            <h4 class="text-2xl font-semibold leading-normal text-white">Organized Content</h4>
                            <p class="mt-2 text-white">If you're taught you can’t do anything, you won’t do anything. I was taught I could do everything.</p>
                         </div>
                      </div>
                   </div>
                </div>
             </div>
          </div>
       </div>
    </div>
 </div>

Features 2

Copied

Places to see

We have been everywhere

But it is good anyway, you do not need to worry. All that has passed, now they are dust and ashes. On the road, there is no way of meeting someone that will help you with one hand and steal with the other hand.

Modular Components

The Arctic Ocean freezes every winter and much of the sea-ice then thaws every summer, and that process will continue whatever and whatever.

Learn more

Modern Interface

If everything I did failed - which it most definitely does not, it quite actually succeeds - just the fact that I'm willing to fail is an inspiration.

Learn more

Great Features

People are so scared to lose that they don't even try. Like, one thing people can't say is that I'm not trying, and I'm not trying my hardest.

Learn more

Awesome Support

The time is now for it to be okay to be great. People in this world shun people for being great. For being a bright color. For beeing honest.

Learn more

<div class="w-full">
    <div class="relative my-12 bg-blueGray-800 text-center py-20" style="background-image: url(&quot;/notus-pro-react/static/media/p31.8a674f45.svg&quot;);">
       <div class="container mx-auto px-4">
          <div class="flex flex-wrap -mx-4 justify-center">
             <div class="px-4 relative w-full text-center">
                <span class="text-purple-500 bg-purple-200 text-xs font-bold inline-block py-1 uppercase uppercase last:mr-0 mr-1 leading-tight rounded px-2">Places to see</span>
                <h2 class="text-4xl font-bold mt-3 mb-1 text-white">We have been everywhere</h2>
                <p class="mt-2 mb-4 text-xl leading-relaxed text-white">But it is good anyway, you do not need to worry. All that has passed, now they are dust and ashes. On the road, there is no way of meeting someone that will help you with one hand and steal with the other hand.</p>
             </div>
          </div>
          <div class="mt-12 flex flex-wrap -mx-4">
             <div class="p-4 relative w-full lg:w-6/12">
                <div class="bg-white text-blueGray-800 rounded-lg text-left p-6 flex items-start">
                   <div class="bg-lightBlue-500 text-white shadow-lg rounded-full justify-center items-center inline-flex text-center p-2 text-xl w-12 h-12"><i class="fas fa-hat-wizard"></i></div>
                   <div class="ml-6 flex-1">
                      <h6 class="text-lightBlue-500 text-xl font-bold mt-3 mb-0">Modular Components</h6>
                      <p class="text-blueGray-500 mt-2 mb-4 leading-relaxed">The Arctic Ocean freezes every winter and much of the sea-ice then thaws every summer, and that process will continue whatever and whatever.</p>
                      <a href="javascript:;" class="text-lightBlue-500">Learn more</a>
                   </div>
                </div>
             </div>
             <div class="p-4 relative w-full lg:w-6/12">
                <div class="bg-white text-blueGray-800 rounded-lg text-left p-6 flex items-start">
                   <div class="bg-orange-500 text-white shadow-lg rounded-full justify-center items-center inline-flex text-center p-2 text-xl w-12 h-12"><i class="fas fa-dungeon"></i></div>
                   <div class="ml-6 flex-1">
                      <h6 class="text-orange-500 text-xl font-bold mt-3 mb-0">Modern Interface</h6>
                      <p class="text-blueGray-500 mt-2 mb-4 leading-relaxed">If everything I did failed - which it most definitely does not, it quite actually succeeds - just the fact that I'm willing to fail is an inspiration.</p>
                      <a href="javascript:;" class="text-orange-500">Learn more</a>
                   </div>
                </div>
             </div>
             <div class="p-4 relative w-full lg:w-6/12">
                <div class="bg-white text-blueGray-800 rounded-lg text-left p-6 flex items-start">
                   <div class="bg-red-500 text-white shadow-lg rounded-full justify-center items-center inline-flex text-center p-2 text-xl w-12 h-12"><i class="fas fa-trophy"></i></div>
                   <div class="ml-6 flex-1">
                      <h6 class="text-red-500 text-xl font-bold mt-3 mb-0">Great Features</h6>
                      <p class="text-blueGray-500 mt-2 mb-4 leading-relaxed">People are so scared to lose that they don't even try. Like, one thing people can't say is that I'm not trying, and I'm not trying my hardest.</p>
                      <a href="javascript:;" class="text-red-500">Learn more</a>
                   </div>
                </div>
             </div>
             <div class="p-4 relative w-full lg:w-6/12">
                <div class="bg-white text-blueGray-800 rounded-lg text-left p-6 flex items-start">
                   <div class="bg-emerald-500 text-white shadow-lg rounded-full justify-center items-center inline-flex text-center p-2 text-xl w-12 h-12"><i class="far fa-image"></i></div>
                   <div class="ml-6 flex-1">
                      <h6 class="text-emerald-500 text-xl font-bold mt-3 mb-0">Awesome Support</h6>
                      <p class="text-blueGray-500 mt-2 mb-4 leading-relaxed">The time is now for it to be okay to be great. People in this world shun people for being great. For being a bright color. For beeing honest.</p>
                      <a href="javascript:;" class="text-emerald-500">Learn more</a>
                   </div>
                </div>
             </div>
          </div>
       </div>
    </div>
 </div>

Features 3

Copied

Notus Design System PRO

We have made quite a collection

I've started a long time ago to drink and gamble. I am sorry, but I do not regret anything. A lot of time has passed, but I still haven't forgotten who was there for me.

Awesome features

The kit comes with three pre-built pages to help you get started faster.

Beautiful elements
Amazing page examples
Super friendly support team

Best prices

If you're taught you can’t do anything, you won’t do anything.

Beautiful elements
Amazing page examples
Super friendly support team

Community support

That’s the main thing people are always controlled by!

Beautiful elements
Amazing page examples
Super friendly support team

Responsive componenets

They're slowed down by their perception of themselves.

Beautiful elements
Amazing page examples
Super friendly support team

<div class="w-full">
    <div class="relative py-20">
       <div class="container mx-auto px-4">
          <div class="mb-12 flex flex-wrap -mx-4 justify-center">
             <div class="px-4 relative w-full lg:w-8/12 text-center">
                <h6 class="mb-2 font-bold uppercase text-red-500">Notus Design System PRO</h6>
                <h3 class="text-3xl font-bold mt-3 mb-1 text-blueGray-700">We have made quite a collection</h3>
                <p class="mt-2 mb-4 text-xl leading-relaxed text-blueGray-400">I've started a long time ago to drink and gamble. I am sorry, but I do not regret anything. A lot of time has passed, but I still haven't forgotten who was there for me.</p>
             </div>
          </div>
          <div class="items-center flex flex-wrap -mx-4 md:mt-12">
             <div class="p-4 relative w-full md:w-6/12">
                <div class="rounded text-left pb-6 px-12 mx-12 flex items-start">
                   <div class="px-6 flex-1">
                      <div class="text-white bg-lightBlue-500 shadow-lg rounded rounded-full justify-center items-center text-left mx-auto mb-6 inline-flex w-12 h-12 text-xl"><i class="fas fa-atom"></i></div>
                      <h4 class="text-2xl font-semibold leading-tight mt-0 mb-2">Awesome features</h4>
                      <p class="mb-4 text-blueGray-500">The kit comes with three pre-built pages to help you get started faster.</p>
                      <ul class="list-none">
                         <li class="py-2">
                            <div class="flex items-center">
                               <i class="mr-2 text-sm text-blueGray-500 fas fa-check"></i>
                               <p class="mb-0">Beautiful elements</p>
                            </div>
                         </li>
                         <li class="py-2">
                            <div class="flex items-center">
                               <i class="mr-2 text-sm text-blueGray-500 fas fa-check"></i>
                               <p class="mb-0">Amazing page examples</p>
                            </div>
                         </li>
                         <li class="py-2">
                            <div class="flex items-center">
                               <i class="mr-2 text-sm text-blueGray-500 fas fa-check"></i>
                               <p class="mb-0">Super friendly support team</p>
                            </div>
                         </li>
                      </ul>
                   </div>
                </div>
             </div>
             <div class="p-4 relative w-full md:w-6/12">
                <div class="rounded text-left pb-6 px-12 mx-12 flex items-start">
                   <div class="px-6 flex-1">
                      <div class="text-white bg-lightBlue-500 shadow-lg rounded rounded-full justify-center items-center text-left mx-auto mb-6 inline-flex w-12 h-12 text-xl"><i class="fas fa-money-bill-wave"></i></div>
                      <h4 class="text-2xl font-semibold leading-tight mt-0 mb-2">Best prices</h4>
                      <p class="mb-4 text-blueGray-500">If you're taught you can’t do anything, you won’t do anything.</p>
                      <ul class="list-none">
                         <li class="py-2">
                            <div class="flex items-center">
                               <i class="mr-2 text-sm text-blueGray-500 fas fa-check"></i>
                               <p class="mb-0">Beautiful elements</p>
                            </div>
                         </li>
                         <li class="py-2">
                            <div class="flex items-center">
                               <i class="mr-2 text-sm text-blueGray-500 fas fa-check"></i>
                               <p class="mb-0">Amazing page examples</p>
                            </div>
                         </li>
                         <li class="py-2">
                            <div class="flex items-center">
                               <i class="mr-2 text-sm text-blueGray-500 fas fa-check"></i>
                               <p class="mb-0">Super friendly support team</p>
                            </div>
                         </li>
                      </ul>
                   </div>
                </div>
             </div>
             <div class="p-4 relative w-full md:w-6/12">
                <div class="rounded text-left pb-6 px-12 mx-12 flex items-start">
                   <div class="px-6 flex-1">
                      <div class="text-white bg-lightBlue-500 shadow-lg rounded rounded-full justify-center items-center text-left mx-auto mb-6 inline-flex w-12 h-12 text-xl"><i class="fas fa-first-aid"></i></div>
                      <h4 class="text-2xl font-semibold leading-tight mt-0 mb-2">Community support</h4>
                      <p class="mb-4 text-blueGray-500">That’s the main thing people are always controlled by!</p>
                      <ul class="list-none">
                         <li class="py-2">
                            <div class="flex items-center">
                               <i class="mr-2 text-sm text-blueGray-500 fas fa-check"></i>
                               <p class="mb-0">Beautiful elements</p>
                            </div>
                         </li>
                         <li class="py-2">
                            <div class="flex items-center">
                               <i class="mr-2 text-sm text-blueGray-500 fas fa-check"></i>
                               <p class="mb-0">Amazing page examples</p>
                            </div>
                         </li>
                         <li class="py-2">
                            <div class="flex items-center">
                               <i class="mr-2 text-sm text-blueGray-500 fas fa-check"></i>
                               <p class="mb-0">Super friendly support team</p>
                            </div>
                         </li>
                      </ul>
                   </div>
                </div>
             </div>
             <div class="p-4 relative w-full md:w-6/12">
                <div class="rounded text-left pb-6 px-12 mx-12 flex items-start">
                   <div class="px-6 flex-1">
                      <div class="text-white bg-lightBlue-500 shadow-lg rounded rounded-full justify-center items-center text-left mx-auto mb-6 inline-flex w-12 h-12 text-xl"><i class="fas fa-laptop-code"></i></div>
                      <h4 class="text-2xl font-semibold leading-tight mt-0 mb-2">Responsive componenets</h4>
                      <p class="mb-4 text-blueGray-500">They're slowed down by their perception of themselves.</p>
                      <ul class="list-none">
                         <li class="py-2">
                            <div class="flex items-center">
                               <i class="mr-2 text-sm text-blueGray-500 fas fa-check"></i>
                               <p class="mb-0">Beautiful elements</p>
                            </div>
                         </li>
                         <li class="py-2">
                            <div class="flex items-center">
                               <i class="mr-2 text-sm text-blueGray-500 fas fa-check"></i>
                               <p class="mb-0">Amazing page examples</p>
                            </div>
                         </li>
                         <li class="py-2">
                            <div class="flex items-center">
                               <i class="mr-2 text-sm text-blueGray-500 fas fa-check"></i>
                               <p class="mb-0">Super friendly support team</p>
                            </div>
                         </li>
                      </ul>
                   </div>
                </div>
             </div>
          </div>
       </div>
    </div>
 </div>

Features 4

Copied

Day by day

If we are down, the sky's the limit

I light a cigarette, like any other day. A lot of people wonder if we don't smoke, you know? To many that want to get our attention, that want to offer their unwanted advice.

For Developers

The time is now for it to be okay to be great. People in this world shun people for being great. For being a bright color. For standing out. But the time is now.

Learn more

For Designers

There’s nothing I really wanted to do in life that I wasn’t able to get good at. That’s my skill. I’m not really specifically talented at anything except for the ability to learn.

Learn more

For Beginners

That’s what I do. That’s what I’m here for. Don’t be afraid to be wrong because you can’t learn anything from a compliment. If everything I did failed - which it doesn't.

Learn more

<div class="w-full">
    <div class="relative py-20">
       <div class="container mx-auto px-4">
          <div class="mb-12 flex flex-wrap -mx-4 justify-start">
             <div class="px-4 relative w-full lg:w-8/12 text-left">
                <span class="text-purple-500 bg-purple-200 text-xs font-bold inline-block py-1 uppercase uppercase last:mr-0 mr-1 leading-tight rounded px-2">Day by day</span>
                <h3 class="text-3xl font-bold mt-3 mb-1 text-blueGray-700">If we are down, the sky's the limit</h3>
                <p class="mt-2 mb-4 text-xl leading-relaxed text-blueGray-500">I light a cigarette, like any other day. A lot of people wonder if we don't smoke, you know? To many that want to get our attention, that want to offer their unwanted advice.</p>
             </div>
          </div>
          <div class="items-center flex flex-wrap -mx-4">
             <div class="px-4 relative w-full lg:w-6/12">
                <div class="bg-white text-blueGray-800 rounded-lg text-left p-6 flex items-start">
                   <div class="bg-purple-500 text-white shadow-lg rounded-full justify-center items-center inline-flex text-center p-2 text-xl w-12 h-12"><i class="fab fa-html5"></i></div>
                   <div class="ml-6 flex-1">
                      <h6 class="text-purple-500 text-xl font-bold mt-3 mb-0">For Developers</h6>
                      <p class="text-blueGray-500 mt-2 mb-4 leading-relaxed">The time is now for it to be okay to be great. People in this world shun people for being great. For being a bright color. For standing out. But the time is now.</p>
                      <a href="javascript:;" class="text-purple-500">Learn more</a>
                   </div>
                </div>
                <div class="bg-purple-500 text-white rounded-lg text-left p-6 flex items-start">
                   <div class="text-purple-500 bg-white shadow-lg rounded-full justify-center items-center inline-flex text-center p-2 text-xl w-12 h-12"><i class="fas fa-cubes"></i></div>
                   <div class="ml-6 flex-1">
                      <h6 class="text-white text-xl font-bold mt-3 mb-0">For Designers</h6>
                      <p class="text-white opacity-75 mt-2 mb-4 leading-relaxed">There’s nothing I really wanted to do in life that I wasn’t able to get good at. That’s my skill. I’m not really specifically talented at anything except for the ability to learn.</p>
                      <a href="javascript:;" class="text-white">Learn more</a>
                   </div>
                </div>
                <div class="bg-white text-blueGray-800 rounded-lg text-left p-6 flex items-start">
                   <div class="bg-purple-500 text-white shadow-lg rounded-full justify-center items-center inline-flex text-center p-2 text-xl w-12 h-12"><i class="fas fa-bell"></i></div>
                   <div class="ml-6 flex-1">
                      <h6 class="text-purple-500 text-xl font-bold mt-3 mb-0">For Beginners</h6>
                      <p class="text-blueGray-500 mt-2 mb-4 leading-relaxed">That’s what I do. That’s what I’m here for. Don’t be afraid to be wrong because you can’t learn anything from a compliment. If everything I did failed - which it doesn't.</p>
                      <a href="javascript:;" class="text-purple-500">Learn more</a>
                   </div>
                </div>
             </div>
             <div class="md:mx-auto px-4 relative w-full lg:w-6/12 w-10/12"><img alt="..." src="https://demos.creative-tim.com/notus-pro-react/static/media/ill.07e25086.png" class="lg:ml-12 w-full h-auto"></div>
          </div>
       </div>
    </div>
 </div>

Features 5

Copied

The fame

I don't care about the fame

The idea is to sell, and people shouldn't talk about you behind your back. We make hits day by day, and we live our lives the best we know. Yo!

Download Design

Because I’m here to follow my dreams and inspire other people to follow their dreams, too. That’s what I’m here for.

Build Somewthing

Society has put up so many boundaries, so many limitations on what’s right and wrong that it’s almost impossible.

Prepare Launch

Why would anyone pick lightBlue over pink? Pink is obviously a better color.Everyone’s born confident, and everything’s...

<div class="w-full">
    <div class="relative bg-blueGray-100 py-20">
       <div class="container mx-auto px-4">
          <div class="flex flex-wrap -mx-4 justify-center">
             <div class="px-4 relative w-full text-center">
                <span class="text-pink-500 bg-pink-200 text-xs font-bold inline-block py-1 uppercase uppercase last:mr-0 mr-1 leading-tight rounded px-2">The fame</span>
                <h2 class="text-4xl font-bold mt-3 mb-1 text-blueGray-700">I don't care about the fame</h2>
                <p class="mt-2 mb-4 text-xl leading-relaxed text-blueGray-400">The idea is to sell, and people shouldn't talk about you behind your back. We make hits day by day, and we live our lives the best we know. Yo!</p>
             </div>
          </div>
          <div class="items-center mt-12 flex flex-wrap -mx-4">
             <div class="text-left px-4 relative w-full lg:w-4/12">
                <div class="shadow-lg rounded-lg bg-white relative flex flex-col min-w-0 break-words bg-white w-full mb-6">
                   <div class="p-6 flex-auto">
                      <div class="bg-lightBlue-500 text-white shadow-lg rounded-full justify-center items-center mx-auto mb-6 inline-flex w-12 h-12"><i class="fas fa-check text-xl"></i></div>
                      <h6 class="text-lightBlue-500 text-xl font-bold mt-0 mb-0">Download Design</h6>
                      <p class="mt-2 mb-4 leading-relaxed text-blueGray-500">Because I’m here to follow my dreams and inspire other people to follow their dreams, too. That’s what I’m here for.</p>
                      <button class="inline-block outline-none focus:outline-none align-middle transition-all duration-150 ease-in-out uppercase border border-solid font-bold last:mr-0 mr-2  text-white bg-lightBlue-500 border-lightBlue-500 active:bg-lightBlue-600 active:border-lightBlue-600 text-sm px-6 py-2 shadow hover:shadow-lg rounded-md">Learn more</button>
                   </div>
                </div>
             </div>
             <div class="text-left px-4 relative w-full lg:w-4/12">
                <div class="shadow-lg rounded-lg bg-white relative flex flex-col min-w-0 break-words bg-white w-full mb-6">
                   <div class="p-6 flex-auto">
                      <div class="bg-emerald-500 text-white shadow-lg rounded-full justify-center items-center mx-auto mb-6 inline-flex w-12 h-12"><i class="fas fa-campground text-xl"></i></div>
                      <h6 class="text-emerald-500 text-xl font-bold mt-0 mb-0">Build Somewthing</h6>
                      <p class="mt-2 mb-4 leading-relaxed text-blueGray-500">Society has put up so many boundaries, so many limitations on what’s right and wrong that it’s almost impossible.</p>
                      <button class="inline-block outline-none focus:outline-none align-middle transition-all duration-150 ease-in-out uppercase border border-solid font-bold last:mr-0 mr-2  text-white bg-emerald-500 border-emerald-500 active:bg-emerald-600 active:border-emerald-600 text-sm px-6 py-2 shadow hover:shadow-lg rounded-md">Learn more</button>
                   </div>
                </div>
             </div>
             <div class="text-left px-4 relative w-full lg:w-4/12">
                <div class="shadow-lg rounded-lg bg-white relative flex flex-col min-w-0 break-words bg-white w-full mb-6">
                   <div class="p-6 flex-auto">
                      <div class="bg-red-500 text-white shadow-lg rounded-full justify-center items-center mx-auto mb-6 inline-flex w-12 h-12"><i class="fab fa-telegram-plane text-xl"></i></div>
                      <h6 class="text-red-500 text-xl font-bold mt-0 mb-0">Prepare Launch</h6>
                      <p class="mt-2 mb-4 leading-relaxed text-blueGray-500">Why would anyone pick lightBlue over pink? Pink is obviously a better color.Everyone’s born confident, and everything’s...</p>
                      <button class="inline-block outline-none focus:outline-none align-middle transition-all duration-150 ease-in-out uppercase border border-solid font-bold last:mr-0 mr-2  text-white bg-red-500 border-red-500 active:bg-red-600 active:border-red-600 text-sm px-6 py-2 shadow hover:shadow-lg rounded-md">Learn more</button>
                   </div>
                </div>
             </div>
          </div>
       </div>
    </div>
 </div>

PresentationSections

Feature

Features 1

Time passage

In the years that have passed

A growing company

Carefully crafted components

Amazing page examples

Dynamic components

Best Quality

Awesome Desgin

Great Performane

Fast Development

Super Fresh

Organized Content

Features 2

We have been everywhere

Modular Components

Modern Interface

Great Features

Awesome Support

Features 3

Notus Design System PRO

We have made quite a collection

Awesome features

Best prices

Community support

Responsive componenets

Features 4

If we are down, the sky's the limit

For Developers

For Designers

For Beginners

Features 5

I don't care about the fame

Download Design

Build Somewthing

Prepare Launch