Xhibiter HTML Documentation

Thank you for purchasing our template. If you have any questions regarding our product feel free to visit support forum

---

Getting Started

Inside the project folder you'll find following folders and files.

• /css - folder with CSS files
• /fonts - folder with fonts
• /img - folder with images
• /js - folder with JavaScript files
• contact.php - file for contact form

Note: Contact form will not work offline. You must upload your website on a server with support of PHP and PHP mail() function.

Usage

Make sure that Node JS is installed to run NPM scripts

Install the project dependencies

npm install

Once installed, run one of the following commands:

1. npm start - Starts development script
2. npm run build - Starts production script
3. npm run build:tailwind - Compiles Tailwind CSS

Tailwind Config

To edit colors, font sizes or any other variables use tailwind.config.js file - Learn more

Example of Tailwind config

        
          module.exports = {
          content: ["./dist/**/*.{html,js}"],
          darkMode: "class",
          theme: {
            ...
            fontFamily: {
              display: ['"CalSans-SemiBold"', "sans-serif"],
              body: ['"DM Sans"', "sans-serif"]
            },
            colors: {
              transparent: "transparent",
              current: "currentColor",
              white: "#ffffff",
              accent: "#8358FF",
              "accent-dark": "#7444FF",
              "accent-light": "#9E7CFF",
              "accent-lighter": "#B9A0FF",
              "light-base": "#F5F8FA",
              green: "#10b981",
              orange: "#FEB240",
              red: "#EF4444",
              blue: "#428AF8",
              jacarta: {
                base: "#5A5D79",
                50: "#F4F4F6",
                100: "#E7E8EC",
                200: "#C4C5CF",
                300: "#A1A2B3",
                400: "#7D7F96",
                500: "#5A5D79",
                600: "#363A5D",
                700: "#131740",
                800: "#101436",
                900: "#0D102D"
              }
            },
        
        

Credits

• Tailwind CSS
• Remix Icons
• Bootstrap 5
• Swiper Slider
• Lightbox for Bootstrap 5
• Chart JS
• Countdown JS
• Tippy JS
• Metamask Detect Provider

Support

If you have any question feel free to visit our Support Forum