6

AMP has many limitations for CSS - it needs to be inlined, cannot exceed 50KB and cannot include !important, filter, nor JavaScript. Which CSS frameworks can be safely used with AMP?

5 Answers 5

6

This is a community wiki, you can expand it if you have something to add.


These CSS-only frameworks are compatible with AMP (sorted by size):

In order to use one of them in an AMP HTML page, get the minified CSS file, remove any !important or filter if they exist, paste the inlined CSS code into <style amp-custom> inside <head> and replace any <img> with <amp-img> inside <body>.

3
  • Which of these are AMP compatible without any changes? Removing !important is going to break lots of these.
    – DD.
    May 4, 2018 at 8:21
  • 1
    @DD These are: AMP Spectre, AMP Surface, AMP MUI.
    – niutech
    May 6, 2018 at 17:14
  • 1
    @DD Also AMP Start.
    – niutech
    May 6, 2018 at 17:20
1

I've created and released one called 1bx.uk that you can see here... https://1bx.uk

It's well documented and built specifically for AMP.

As we use it in our business, it will be well supported

1
  • This site can’t be reached 1bx.uk’s server IP address could not be found. DNS_PROBE_FINISHED_NXDOMAIN
    – Jay
    Dec 17, 2019 at 19:40
1

This framework is individually adaptable.

https://www.ampcssframework.com

1

Amp CSS Framework is based on Bootstrap.

See here: https://ampcssframework.com

0

Maybe missing: http://basscss.com/v7/docs/guides/ui/

or as scss

https://github.com/basscss/basscss-sass

.. yes it not so active but might be interesting, the syntax seems short and simple, also independently reusable components

2

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.