Drupal Radix Logo

Radix is the original component-based theme for Drupal. It comes with Bootstrap 5, Sass, ES6, BrowserSync, BiomeJS built-in.

 

 

Radix Documentation

Read the comprehensive documentation on Radix 6.x and learn about its ideology and structure

 

📚 Radix Documentation

Which version? For Bootstrap 5 use 6.x, for Bootstrap 4, download 8.x-4.x. For Bootstrap 3. download 8.x-3.x.


Quick start for Radix 6 (Drupal 10.3+)

Note that 6.x works with Starterkit theme and Single directory components in the core, so no need to use the components module anymore:

Drupal Radix CLI

Try our new Radix CLI with features like list, add and generate new components


drupal-radix-cli

 

Getting started with Radix CLI

Drupal Radix SKILL

Try our new Radix Skill to build better with AI.

Getting started with Radix AI Skill

or simply run:
npx skills add doxigo/drupal-radix-skill

Radix 6 Tutorial

 Tutorial video

  • Download and enable the Radix theme:
    composer require 'drupal/radix:^6.0'
  • Create a sub-theme using Drush (Considering you are using drupal/recommended-project):
    drush --include="web/themes/contrib/radix" radix:create SUBTHEME_NAME
  • Set default theme:
    drush then SUBTHEME_NAME -y; drush config-set system.theme default SUBTHEME_NAME -y
  • Go to the newly created theme directory:
    cd /path/to/SUBTHEME_NAME
  • and then switch to the appropriate node version using nvm:
    nvm use
  • Install the required packages:
    npm install
  • In the root of the theme, create a copy of the .env.example and rename it to .env.local:
    cp .env.example .env.local
  • Update the DRUPAL_BASE_URL variable in your .env.local to point to your localhost address (this file is .gitignored by default to avoid conflicts)
  • Watch:
    npm run watch
  • Build for production:
    npm run production

  • Support and Credits

     

    Join the Radix Slack channel

    Join Drupal Radix Slack channel.

    Or search for #radix on Drupal Slack.

     

    Ramsalt Norwegian Drupal Agency

    Supporting organizations: 
    5.x/6.x Core Development/Support/Maintenance
    7.x, 8.x Initial Development/Support
    8.x Maintenance and 5.x Initial Development

    Project information

    Releases