Skip to content
Primer Design System
Brand
View Components
React Components
Site navigation
Guides
Introduction
About
Figma
Introduction
Getting started
How to contribute
Development
React
Rails
Component lifecycle
Component status
Accessibility
Accessibility at GitHub
Guidelines
Tools
Alternative text for images
Assistive technology announcements
Descriptive buttons
Focus management
Headings
Links
Semantic HTML
Text resize and respacing
Tooltip alternatives
Contribute
How to contribute
Design
Content
Documentation
Handling new patterns
Adding new components
Foundations
Color
Responsive
CSS utilities
Getting started
Animations
Borders
Box shadow
Colors
Details
Flexbox
Grid
Layout
Margin
Padding
Typography
Layout
Typography
Icons and visuals
Octicons
Octovisuals
Design guidelines
System arguments
UI patterns
Empty states
Feature onboarding
Forms
Messaging
Progressive disclosure
Saving
Components
Action bar
Action list
Action menu
Anchored overlay
Autocomplete
Avatar
Avatar pair
Avatar stack
Banner
Blankslate
Border box
Box
Branch name
Breadcrumbs
Button
Button group
Button marketing
Checkbox
Checkbox group
Clipboard copy
Close button
Comment box
Counter label
Data table
Details
Dialog
Dropdown
Filter input
Flash
Form control
Heading
Hidden text expander
Icon button
Label
Layout
Icon
Image
Image crop
Link
Markdown
Menu
Nav list
Octicon symbols
Overlay
Page header
Pagination
Popover
Progress bar
Segmented control
Radio
Radio group
Relative time
Select
Select panel
Spinner
State label
Subhead
Tab container
Tab nav
Tab panels
Text
Text input
Text input with tokens
Textarea
Timeline item
Toggle switch
Token
Tooltip
Tree view
Truncate
Underline nav
Underline panels
GitHub staff
GitHub shared components
Native
CLI
Getting started
Foundations
Components
Desktop
Getting started
Foundations
Mobile
Platforms
Foundations
GitHub
Truncate
Use Truncate to shorten overflowing text with an ellipsis.
Overview
Rails
Work in progress
We are currently working on general guidance for this component.