Please check the official documentation in documentation/tutorial-components.html
or directly to this link: https://creativetimofficial.github.io/now-ui-kit-pro/#/components
We've also included an optional Gulp file to help you get started with theme customization. You'll need to install Node.js and Gulp before using our included gulpfile.js.
- Download the project's zip
- Make sure you have node.js (https://nodejs.org/en/) installed
- Type
npm install
in terminal/console in the source folder wherepackage.json
is located - You will find all the branding colors inside
assets/scss/_variables.scss
. You can change them with aHEX
value. - Run in terminal
gulp compile:scss
for a single compilation orgulp watch
for continous compilation of the changes that you make in*.scss
files. This command should be run in the same folder wheregulpfile.js
andpackage.json
are located - Run in terminal
gulp
for opening the Presentation Page (default) of the product.
If you experience any problems with the above, or if you think you've found a bug with your theme - please don't hesitate to reach out to https://www.creative-tim.com/support thanks!!
Within the download you'll find the following directories and files:
now-ui-kit-pro/
├── CHANGELOG.md
├── README.md
├── assets/
│ ├── css/
│ │ ├── bootstrap.min.css
│ │ ├── demo.css
│ │ └── now-ui-kit.css
│ ├── fonts/
│ │ ├── nucleo-license.md
│ │ ├── nucleo-outline.eot
│ │ ├── nucleo-outline.ttf
│ │ ├── nucleo-outline.woff
│ │ └── nucleo-outline.woff2
│ ├── img/
│ ├── js/
│ │ ├── core/
│ │ │ ├── bootstrap.min.js
│ │ │ ├── jquery.3.2.1.min.js
│ │ │ └── popper.min.js
│ │ ├── now-ui-kit.js
│ │ └── plugins/
│ │ ├── bootstrap-datetimepicker.min.js
│ │ ├── bootstrap-selectpicker.js
│ │ ├── bootstrap-switch.js
│ │ ├── bootstrap-tagsinput.js
│ │ ├── jasny-bootstrap.min.js
│ │ ├── moment.min.js
│ │ ├── nouislider.min.js
│ │ └── presentation-page
│ │ └── rellax.min.js
│ └── scss
│ ├── demo.scss
│ ├── now-ui-kit/
│ └── now-ui-kit.scss
├── documentation/
│ ├── template.html
│ └── tutorial-components.html
├── examples/
│ ├── about-us.html
│ ├── blog-post.html
│ ├── blog-posts.html
│ ├── contact-us.html
│ ├── ecommerce.html
│ ├── landing-page.html
│ ├── login-page.html
│ ├── pricing.html
│ ├── product-page.html
│ ├── profile-page.html
│ └── signup-page.html
├── gulpfile.js
├── index.html
├── nucleo-icons.html
├── package.json
├── presentation.html
└── sections.html