For our marketing website, we use the Marketing DLS. Designers utilize components from the DLS whenever possible to ensure consistent design across Sourcegraph marketing touchpoints and efficient development time. The DLS is based on the Tailwind CSS framework. When designing our product, we use Wildcard, to create visual design artifacts in Figma. While these are separate design systems, they both inherit the Sourcegraph brand expression to their own degree (product is more subtle in brand expression, marketing is very brand-driven). Whenever new components are added, it’s important for designers to reference both existing libraries to create consistency whenever possible. This ensures a smooth user experience from first site visit to actually using our product.
The Marketing DLS is the primary library to use for all marketing design in order to have access to all of our components and styles. The Helpers and Tooling also contains useful components like redlines and annotation.
- We use Source Sans 3 and Source Code Pro. Download both font families and install it on your system.
- You may also need the Figma font installer if you use Figma in the browser instead of on desktop.
- All text styles are available through the DLS typography page
- The marketing DLS has a single complete palette, based on our core brand colors.
- They can be found on the Colors page
- For guidance on how to apply these colors in marketing, reference the Colors section of our Brand Guidelines.
If you’re new to using Figma, there are some instructions and tips in using figma.