16 articles
Getting Started
Installation, file structure, SCSS and Gulp setup, dark mode, fonts, and everything you need to launch your first Canvas site.
Working with SCSSWorking with SCSS Canvas ships its full SASS source so you can change colors, spacing, typography, and component styles at the source and recompile a…InstallationFollow the steps below to get started with Canvas 8 : Download and unzip the Canvas package you purchased from ThemeForest, then open the folder to…SCSS & Gulp.jsCanvas ships with a full SCSS source and a Gulp.js build pipeline so you can customize the styles cleanly and compile production-ready assets.…Niche DemosUsing Niche DemosHTML StructureCanvas follows a simple, predictable HTML structure that is easy to understand and build on. Every page wraps its content in a single element and…Page TransitionPage Loading TransitionsLogo SettingsLogo Settings The site logo lives in . Canvas supports multiple logo images in the same block so the correct one shows in different states: default,…Color SchemesColor Schemes Canvas is built on CSS custom properties, so changing the accent color of your whole site is usually a one-line change. The main…Dark ModeDark Mode Canvas has full dark mode support. You can make a whole page dark, make a single section dark, or add a switcher that lets visitors toggle…Changing FontsChanging Fonts Canvas uses two font families by default: a body font and a secondary (heading and accent) font. Both are wired to CSS variables, so…Theme CustomizationCanvas is built to be customized without ever touching the core files, so your changes survive every update. There are two levels of customization:…JavascriptSign in requiredJavaScript Canvas loads its JavaScript with just two files, in a fixed order, at the end of the . The load order bundles the third-party libraries…Setting up RTLSetting Up RTL Canvas ships full right-to-left (RTL) support for languages like Arabic, Hebrew, and Persian. Enabling it takes two changes: set the…HTTPs CompatibilityHTTPS Compatibility Canvas works over HTTPS out of the box. The one thing to watch for is mixed content: an HTTPS page that loads an asset over plain…Website Optimization TipsSign in requiredA fast website ranks better, converts better, and costs less to serve. Canvas is already lightweight, but how you build and deploy your pages makes…Walkthrough VideosCustom Package Builder Build a custom package with only the files you need using the Custom Package builder in your dashboard. Flex Utilities…