Skip to content
{% spotlight %}
AutoXXS (320px)XS (375px)SM (640px)MD (768px)LG (1024px)XL (1280px)XXL (1536px)
SketchMaterialiOSTamagui
DataInjectionKeyPatternsServiceTransactionProcessResearchProductQualityPerformanceSpecDomainFunctionTechnologyArchitectureConfigMiddlewareDataDatabaseDrizzleMigrationModelop-sqliteSchemaSQLState ManagementDraftKeystoneMergePatchPatchesPersistenceReactiveRedoStoreUndoTestingDeviceFactoryIsolationTypeScriptZodTopicsCommunicationBidsNVCDesignDesign ImplicationsEducationPedagogyFoundationsPsychologyAttachmentFloodingRelatingAuthentic RelatingUIEditorReact Native

{% spotlight %}

Attributes

Parameter Type Required Description
target string Element data-wf-id within the stop's surface (set via id= in the Pug DSL)
type enum ring | pulse | dim | highlight — default: ring
duration number Animation cycle in ms for pulse type (default: 1200)

Valid Parent Contexts

This tag is valid inside: {% stop %}

Self-closing tag. Multiple spotlights per stop render simultaneously.

Dim one element and ring another
tagspotlightstoptour spotlight-tag-combined
{% spotlight target="primary-nav" type="dim" /%}
{% spotlight target="add-button" type="ring" /%}