COMPONENTS
Pull to Refresh
Pull to refresh allows refreshing contents on a touch based device with a drag-down gesture at the top of the page.
- Container
- Loading Indicator
- Label
The Pull to Refresh component has two core variations — dark or light.
Within each variation of the banner, the background color can be set to a custom color to match the surrounding display. Colors should be chosen from the color system and contrast for legibility should be taken into account.
Pull to refresh should be at the top of the main page container and below any top navigational items.
DO: Consider matching the background color to the surrounding interface or use a compliementary surface color from the color tokens.
DON’T: Use a background color with too much vibrancy. Use the surface token colors.
Contents