> For the complete documentation index, see [llms.txt](https://design.cal.com/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://design.cal.com/basics.md).

# Basics

- [Colors](https://design.cal.com/basics/colors.md): Color tokens are the primitive values in our design system, represented by context names.
- [Typography](https://design.cal.com/basics/typography.md): Great type is at the core of our branding, and we make good use of our own custom font.
- [Shadows](https://design.cal.com/basics/shadows.md): Shadows are an important part of our design, and should always be replicated closely.
- [Grid](https://design.cal.com/basics/grid.md): We should align everything within our standardised grid.
- [Icons](https://design.cal.com/basics/icons.md): We use icons within the app to give a quick visual reference when navigating.
- [Breakpoints](https://design.cal.com/basics/breakpoints.md): Here you can find our standardised breakpoints that we use to define Cal.com's responsive design.