kiseki_theme

Kiseki Theme

Kiseki Theme is a Drupal 10/11 theme built with Single Directory Components (SDC), atomic design principles, SCSS, and design tokens. It is intended for teams that want a composable component library, strong accessibility defaults, and a modern front-end workflow that is practical to maintain over time.

Key features

• Single Directory Components organised as atoms, molecules, and organisms
• Accessibility-first component authoring with semantic HTML, ARIA support, keyboard navigation, and colour contrast considerations
• Reusable page-building patterns powered by Paragraphs and SDC Display
• Design token workflow using Style Dictionary
• Playwright-based visual regression and accessibility testing
• Responsive layouts and reusable UI patterns including banners, sliders, cards, timelines, accordions, stats, and webform sections

Requirements

• Drupal 10 or Drupal 11
• Media
• Paragraphs
• No Markup
• SDC Display
• Node.js and npm for asset builds and test runs

Installation overview

1. Place the theme in web/themes/custom/kiseki_theme
2. Enable the required Drupal modules
3. Run npm install in the theme directory
4. Run npm run build
5. Enable the theme and set it as the default theme

Why use Kiseki Theme?

Kiseki Theme is designed to support both implementation and long-term maintenance. It includes compiled assets, component demos, and a styleguide-oriented workflow so teams can build, test, and evolve a Drupal front end with more consistency and less duplication.