Codebase

Version 4.0.11

---

Codebase 4 has been superceded by Codebase 5. See https://github.com/codebase-frontend-library/codebase-5

---

Features

• Designed as a frontend CSS/JS codebase for content management system themes and static site generator projects
• Just use it in your HTML: no NPM or other installation required – no config – no need to purge unused CSS
• Small but powerful CSS:
  • Base (default light theme only): codebase.css (38 KB)
  • With dark and light theme CSS classes: codebase-l-d.css (64 KB)
• JS options:
  • Use Codebase’s own vanilla JavaScript activator.js (3 KB) for dropdowns, modals, tabs etc. (jQuery version also available for older browsers)
  • Alternatively, use AlpineJS for more component functionality
• Sass (SCSS) library
• Responsive layouts and typography
• Does most things most web designers want:
  • Columnar grid system (uses CSS grid)
  • Flexbox system
  • Utility classes for layout positioning, dimensions, overflows, etc.
  • Utility classes for decoration and enhanced typography, using a soft element grid (0.5rem units)
  • “Utility first” approach for building HTML components.
• Highly customizable
• Modern browser compatible
• Extensive documentation

---

View the docs →

---

Production Codebase CSS and Activator JS (ES5) are in the Docs dist/ folder - see https://github.com/codebase-frontend-library/codebase-4/tree/master/docs/dist

Codebase SCSS and Activator JS ES6 are in the Source codebase/ folder - see https://github.com/codebase-frontend-library/codebase-4/tree/master/src/codebase

---

If you still need to support Internet Explorer 11 – Codebase can do that, although IE11 is not officially supported by Codebase. There are some things with IE11 that you can’t do; and if you want to use Activator then you need to switch to using jQuery v.2.x and alpine.jquery.js. For more information See Codebase and Internet Explorer 11.

---

Codebase CSS and Activator JS have been built using Gulp with plugins for Sass and Babel. Documentation has been built using Eleventy. Docs demo icons are from Tabler icons.