styled-inline-components

Inline style system for styled-components

Install

npm install styled-inline-components styled-components

Usage

import React from 'react';
import Elements from 'styled-inline-components';

const {Div, P} = Elements;

const Component = () => {
  return (
    <Div padding='20px' background='papayawhip'>
      <P color='palevioletred'>Hello World</P>
    </Div>
  );
};

Any dom element that styled-components recognizes as valid can be used. To require it, capitalize the first letter of the element.

For example:

| Tag | Component | |:--------|:----------| | div | Div | | p | P | | section | Section |

Why?

Inspired by a styled-components spectrum thread.