examples

Pico CSS

Pico.css examples

Minimalist templates to discover Pico in action:

Pico v2 examples - **[Preview](https://codesandbox.io/s/github/picocss/examples/tree/master/v2-html)** A pure HTML example, without dependencies. - **[Class-less preview](https://codesandbox.io/s/github/picocss/examples/tree/master/v2-html-classless)** A class-less example, without dependencies. - **[Customized design system](https://codesandbox.io/s/github/picocss/examples/tree/master/v2-sass-customized-design-system)** An example to customize Pico CSS with SASS. - **[React class-less login](https://codesandbox.io/s/github/picocss/examples/tree/master/v2-react-classless-login)** A minimal, class-less login page in React, with a custom primary color. - **[React color schemes and modal](https://codesandbox.io/s/github/picocss/examples/tree/master/v2-react-color-schemes-and-modal)** Switch color schemes and open modals with React. - **[Conditional Styling](https://codesandbox.io/s/github/picocss/examples/tree/master/v2-conditional-styling)** A minimal example with the conditional version.

Pico v1 examples - **[Preview](https://codesandbox.io/s/github/picocss/examples/tree/master/v1-preview)** A starter example with most of the Pico components and styles. - **[Right-to-left (RTL) preview](https://codesandbox.io/s/github/picocss/examples/tree/master/v1-preview-rtl)** A starter example in Arabic with most of the Pico components and styles. - **[Classless](https://codesandbox.io/s/github/picocss/examples/tree/master/v1-classless)** A pure semantic HTML markup, without `.classes`. - **[Basic template](https://codesandbox.io/s/github/picocss/examples/tree/master/v1-basic-template)** A basic custom template for Pico using only CSS custom properties (variables). - **[Company](https://codesandbox.io/s/github/picocss/examples/tree/master/v1-company)** A classic company or blog layout with a sidebar. - **[Google Amp](https://codesandbox.io/s/github/picocss/examples/tree/master/v1-google-amp)** A simple layout for Google Amp, with inlined CSS. - **[Sign in](https://codesandbox.io/s/github/picocss/examples/tree/master/v1-sign-in)** A minimalist layout for Login pages. - **[Pico + Bootstrap grid system](https://codesandbox.io/s/github/picocss/examples/tree/master/v1-bootstrap-grid)** Custom CSS build with the Bootstrap grid system to manage complex grid layouts in Pico.