USA Stars And Stripes Patterns For CSS Background – USA.css

Preview:

Description:

USA.css is a CSS only pattern library that fills your empty background with patriotic stars and stripes patterns.

Created using CSS linear-gradient(), radial-gradient(), and conic-gradient() functions.

Perfect for Independence Day & America First & Make America Great Again design projects to show your American pride.

How to use it:

1. Download and load the minified version of the USA.css library on the page.

<link rel="stylesheet" href="usa.min.css" />

2. Use USA stars as a background pattern.

<div class="usa-stars">
  ... content here ...
</div>

3. Use USA stripes as a background pattern. Supports both vertical and horizontal directions:

<div class="usa-stripes-horizontal">
  ... content here ...
</div>
<div class="usa-stripes-vertical">
  ... content here ...
</div>

4. Create a background pattern with diamonds.

<div class="usa-diamond">
  ... content here ...
</div>

5. Create a radial background pattern.

<div class="usa-radial">
  ... content here ...
</div>

6. Create a plaid background pattern.

<div class="usa-plaid">
  ... content here ...
</div>

7. Create a conic background pattern.

<div class="usa-conic">
  ... content here ...
</div>