Lightning Component Library

The Lightning Component Library includes component reference information and tools for Lightning Web Security and Lightning Locker.

You can find the Component Library in two places: a public site and an authenticated one that’s linked to your Salesforce org. In the authenticated site, the Component Reference section of the Component Library has some additional features.

Public Component Library

View this site without logging in to Salesforce. The Component Reference includes documentation and reference information for the base components.

https://developer.salesforce.com/docs/component-library

Component Library for your org

View this site by logging in to your Salesforce org and navigating to https://<myDomainName>.lightning.force.com/docs/component-library. Alternatively, click Link to your org at the top right on the public site.

The authenticated site has more features for the Component Reference.

  • View Lightning components that are unique to your org.
  • View Lightning components that are installed in a managed package. You can filter to view components owned by your org or installed in packages.

The Developer Guide is no longer available in the Component Library. Accessing https://developer.salesforce.com/docs/component-library/documentation/en/lwc redirects you to https://developer.salesforce.com/docs/platform/lwc/guide.

The Component Reference is where you find the details about each base Lightning component. It documents the full set of base components for both the Lightning Web Components and Aura programming models.

Here are a few highlights about the Component Reference.

Filter components

On the Overview page, filter to focus on the components you’re interested in. For example, to see only those components related to navigation, select Filters | Categories | Navigation.

View targets

When you select a component, the Target panel at the top shows where you can use the component. Targets can include Salesforce App, Lightning Experience, Experience Builder Sites, Salesforce Mobile App, Standalone Lightning App, and so on.

Switch between components

Switch between the versions of a component by clicking the View as Aura Component and View as Lightning Web Component button.

View example, documentation, and specification pages

Most components have Example, Documentation, and Specification pages. Some components, such as lightning-record-form and lightning-input-field, require Salesforce data. They can't be used outside an org and don't have an Example page.

Modify interactive examples

The Example page features interactive code samples that demonstrate how the component looks and behaves. You can view the code that’s running. For Lightning web components, you can also edit the example code in the Lightning Mini Playground and see your changes immediately in the interactive example. However, the components used in the examples are not the latest versions. See Component Reference Examples.

Here are some known issues with the Component Reference.

Examples use older versions of base Lightning components and Salesforce Lightning Design System (SLDS)

Due to technical limitations, the runtime environment for the examples doesn't use the latest versions of the components and SLDS. For more information, see Component Reference Examples.

Non-lightning namespace differences in the public vs authenticated Component Reference

In the public site, the Component Reference for non-lightning namespaces can contain outdated content. For non-lightning components, such as wave:waveDashboard or force:createRecord, verify the specification and documentation in https://<myDomainName>.lightning.force.com/docs/component-library.

Documentation for Lightning web components developed in your org isn’t supported

The Component Reference doesn’t display documentation for your custom Lightning web components

Specification panel missing content

Modules don’t display descriptions or methods on the Specification page. The descriptions and methods are on the Documentation page. Modules include:

  • lightning/empApi
  • lightning/flowSupport
  • lightning/messageService
  • lightning/navigation

Some attributes that have default values don't display a value in the Default column. See the Description column for default values.

Custom events aren’t displayed in Specification pages. See the component’s Documentation page for this information.

Versioning and localization aren’t supported

The Component Reference doesn’t provide a Version or Language selector like other Salesforce developer documentation. It displays documentation that corresponds to the current release only, and the content is available only in English.

The Examples tab shows base Lightning component sample code that renders in a runtime environment on the page.

To experiment with a Lightning web component example, modify the code and click Run. Aura component examples aren’t editable but do render and you can interact with them.

The runtime environments don’t use the latest versions of the base Lightning components due to technical limitations that we’re working to address. For this reason, component changes such as new documented attributes in recent releases aren’t reflected in the examples and don’t work if you add them to the examples.

The runtime environments also don't keep up with SLDS releases. The Web Content Accessibility Guidelines (WCAG) color updates that we announced in the See Improved Color Contrast in UI Elements Winter ‘24 release note aren’t reflected in the examples. However, the base Lightning components that you use in your custom components and run in your Salesforce org do include the latest features of the base components and SLDS.

Lightning Web Security (LWS) Console and LWS Distortion Viewer help you develop secure JavaScript code that runs with Lightning Web Security.

For more information about using these tools, see Evaluate JavaScript in Lightning Web Security Console and Look Up Distortion Details in Lightning Web Security Distortion Viewer.

For more about Lightning Web Security and how it compares to Lightning Locker, see Lightning Web Security.

The Locker Console and Locker API Viewer help you develop secure JavaScript code that is compatible and runs efficiently with Lightning Locker.

For more information about using these tools, see Lightning Locker Tools in the Lightning Aura Components Developer Guide.

For more about Lightning Locker and Lightning web components, see Lightning Locker.