Bolt Design System

Note: when assigning component props as HTML attributes on a web component, make sure to use kebab-case.

Prop Name	Description	Type	Default Value	Option(s)
attributes	A Drupal-style attributes object with extra attributes to append to this component.	`object`	—	—
iconOneName	Name of first icon.	`string`	`eye`	`NULL`, `academy`, `add-open`, `add-solid`, `agile`, `app-development`, `app-exchange`, `arrow-left`, `asset-data`, `asset-infographic`, `asset-interactive`, `asset-link`, `asset-media`, `asset-podcast`, `asset-presentation`, `asset-text`, `asset-video`, `bolt-logo-colored`, `brand-operations`, `calendar`, `careers`, `case-management`, `check`, `check-circle`, `check-solid`, `chevron-down`, `chevron-left`, `chevron-right`, `chevron-up`, `close`, `close-open`, `close-solid`, `cloud`, `co-browse`, `communications`, `copy-to-clipboard`, `customer-decision-hub`, `customer-onboarding`, `customer-service`, `data-integrations`, `documentation`, `download`, `email`, `energy`, `entertainment`, `exclamation`, `exit-full-screen`, `external-link`, `eye`, `eye-off`, `facebook`, `facebook-solid`, `field-service`, `field-service-gray`, `filter`, `financial`, `full-screen`, `github`, `global`, `government`, `healthcare`, `hospitality`, `industries`, `info-open`, `info-solid`, `insurance`, `integration`, `intelligent-virtual-assistant`, `java`, `knowledgebase`, `launchpad`, `life-sciences`, `linkedin`, `linkedin-solid`, `lock`, `manufacturing`, `map-pin`, `map-pin-solid`, `marketing`, `marketing-gray`, `menu`, `minus-open`, `minus-solid`, `mobility`, `more`, `omni-channel`, `partners`, `pencil`, `platform`, `podcast`, `print`, `product`, `product-delivery`, `refresh`, `reporting`, `retail`, `robo-auto`, `sales-automation`, `scalability`, `search`, `share`, `star-solid`, `support`, `system-admin`, `training`, `transportation`, `twitter`, `twitter-solid`, `unlock`, `upload`, `user`, `user-interface`, `video`, `vision`, `warning`, `watch`, `workforce-intelligence`, `youtube-solid`
iconTwoName	Name of second icon.	`string`	`eye`	`NULL`, `academy`, `add-open`, `add-solid`, `agile`, `app-development`, `app-exchange`, `arrow-left`, `asset-data`, `asset-infographic`, `asset-interactive`, `asset-link`, `asset-media`, `asset-podcast`, `asset-presentation`, `asset-text`, `asset-video`, `bolt-logo-colored`, `brand-operations`, `calendar`, `careers`, `case-management`, `check`, `check-circle`, `check-solid`, `chevron-down`, `chevron-left`, `chevron-right`, `chevron-up`, `close`, `close-open`, `close-solid`, `cloud`, `co-browse`, `communications`, `copy-to-clipboard`, `customer-decision-hub`, `customer-onboarding`, `customer-service`, `data-integrations`, `documentation`, `download`, `email`, `energy`, `entertainment`, `exclamation`, `exit-full-screen`, `external-link`, `eye`, `eye-off`, `facebook`, `facebook-solid`, `field-service`, `field-service-gray`, `filter`, `financial`, `full-screen`, `github`, `global`, `government`, `healthcare`, `hospitality`, `industries`, `info-open`, `info-solid`, `insurance`, `integration`, `intelligent-virtual-assistant`, `java`, `knowledgebase`, `launchpad`, `life-sciences`, `linkedin`, `linkedin-solid`, `lock`, `manufacturing`, `map-pin`, `map-pin-solid`, `marketing`, `marketing-gray`, `menu`, `minus-open`, `minus-solid`, `mobility`, `more`, `omni-channel`, `partners`, `pencil`, `platform`, `podcast`, `print`, `product`, `product-delivery`, `refresh`, `reporting`, `retail`, `robo-auto`, `sales-automation`, `scalability`, `search`, `share`, `star-solid`, `support`, `system-admin`, `training`, `transportation`, `twitter`, `twitter-solid`, `unlock`, `upload`, `user`, `user-interface`, `video`, `vision`, `warning`, `watch`, `workforce-intelligence`, `youtube-solid`
iconThreeName	Name of third icon.	`string`	`eye`	`NULL`, `academy`, `add-open`, `add-solid`, `agile`, `app-development`, `app-exchange`, `arrow-left`, `asset-data`, `asset-infographic`, `asset-interactive`, `asset-link`, `asset-media`, `asset-podcast`, `asset-presentation`, `asset-text`, `asset-video`, `bolt-logo-colored`, `brand-operations`, `calendar`, `careers`, `case-management`, `check`, `check-circle`, `check-solid`, `chevron-down`, `chevron-left`, `chevron-right`, `chevron-up`, `close`, `close-open`, `close-solid`, `cloud`, `co-browse`, `communications`, `copy-to-clipboard`, `customer-decision-hub`, `customer-onboarding`, `customer-service`, `data-integrations`, `documentation`, `download`, `email`, `energy`, `entertainment`, `exclamation`, `exit-full-screen`, `external-link`, `eye`, `eye-off`, `facebook`, `facebook-solid`, `field-service`, `field-service-gray`, `filter`, `financial`, `full-screen`, `github`, `global`, `government`, `healthcare`, `hospitality`, `industries`, `info-open`, `info-solid`, `insurance`, `integration`, `intelligent-virtual-assistant`, `java`, `knowledgebase`, `launchpad`, `life-sciences`, `linkedin`, `linkedin-solid`, `lock`, `manufacturing`, `map-pin`, `map-pin-solid`, `marketing`, `marketing-gray`, `menu`, `minus-open`, `minus-solid`, `mobility`, `more`, `omni-channel`, `partners`, `pencil`, `platform`, `podcast`, `print`, `product`, `product-delivery`, `refresh`, `reporting`, `retail`, `robo-auto`, `sales-automation`, `scalability`, `search`, `share`, `star-solid`, `support`, `system-admin`, `training`, `transportation`, `twitter`, `twitter-solid`, `unlock`, `upload`, `user`, `user-interface`, `video`, `vision`, `warning`, `watch`, `workforce-intelligence`, `youtube-solid`
iconColor	Color of all icons.	`string`	`teal`	—
iconBackgroundColor	Background color of all icons.	`string`	`white`	—

Icon Group Docs