Google AMP web component CSS framework
The most popular Google AMP web component CSS library

Build responsive Google AMP projects on the web with Google AMP CSS Framework, the most popular front-end component library based on Bootstrap

Download Donate

What is Google AMP?

Google AMP is a web component framework to easily create user-first websites.

Whether you are a publisher, e-commerce company, storyteller, advertiser or email sender, Google AMP makes it easy to create great experiences on the web. Use Google AMP to build:

  • Google AMP Websites
  • Google AMP Stories
  • Google AMP Ads
  • Google AMP Email
LEARN MORE ABOUT GOOGLE AMP

What is the Google AMP CSS Framework?

A popular Google AMP CSS Library

Google AMP CSS Framework is a free and responsive CSS library to easily create user-first websites.

Our library is based on Bootstrap and has been optimized for "Accelerated Mobile Pages".

This framework is for mobile devices as well for desktop devices. Therefore it is a CSS library for all viewports.

Compatible with all modern desktop and mobile browsers.

Due to Google AMP is not accepting custom JavaScript files and maximum 50kb custom stylesheets are allowed, we made Bootstrap Google AMP capable and we equipped the source files with @if $enable - classes. Therefore it is possible to enable or disable single or complex Bootstrap components, which are Google AMP compatible. < p > Adjust your individual CSS files with this function in the options.scss(please note, your compiled CSS file can be maximum 50kb).

Google AMP Framework · News & updates

Media query prefers-color-scheme

prefers-color-scheme is a CSS media query that detects the current theme preference of the user's operating system.

The prefers-color-scheme media query has two values that you can specify: light and dark. These values allow you to customize the theme of the page with CSS depending on the user's preference.

light Indicates that the user has notified the system that they prefer a page that has a light theme (dark text on light background).

dark Indicates that the user has notified the system that they prefer a page that has a dark theme (light text on dark background).

- 01/01/2021

Google AMP Framework · Cards

Top image

Some quick example text over the card 1 image.

Middle Image

Some quick example text over the card 2 image.

/>

Some quick example text under the card 2 image.

Bottom image

Some quick example text under the card 3 image.