GlowDivider

Status: archived. This component lives under an _archive/ directory in the source repo and is not part of the actively-recommended UI surface. It ships in the published NPM tarball (1.2.3) but is not auto-imported by Nuxt because of the _archive path prefix. Use it for legacy designs only — for new work prefer XMarkDividerGlow, which exposes more height options and accepts any Tailwind color name.

The XMarkGlowDivider component renders a 1px horizontal line with an optional halo glow on either side. The line is built from three stacked bg-gradient-to-r from-transparent to-transparent divs that pass through a color-tinted midpoint. At intensity="strong", an extra-large blur-xl halo is added.

Components

<XMarkGlowDivider />

Minimal — primary color, medium glow, default my-16 spacing:

<XMarkGlowDivider />

Subtle, neutral, with custom spacing:

<XMarkGlowDivider color="neutral" intensity="subtle" spacing="my-8" />

Full glow, primary, hero-to-section transition:

<XMarkGlowDivider color="primary" intensity="strong" spacing="my-24" />

Props

AI Context

category: Pattern
package: "@xenterprises/nuxt-x-marketing"
components:
  - XMarkGlowDivider
status: archived
use-when: >
  Legacy horizontal section divider with a glow halo. Prefer XMarkDividerGlow
  for new designs (3 height options, any Tailwind color name, more intensity
  levels).
typical-page-section: Between any two adjacent content blocks, between hero and first section, or above the footer.
import: >
  Not auto-imported (path begins with `_archive/`). Import explicitly:
  import XMarkGlowDivider from '@xenterprises/nuxt-x-marketing/app/components/X/Mark/_archive/Pattern/GlowDivider.vue'