ansumanshah / Css In Js
Licence: mit
Autocomplete React Native / JS Styles and converting plain CSS to JS styles
Stars: ✭ 192
Programming Languages
javascript
184084 projects - #8 most used programming language
Projects that are alternatives of or similar to Css In Js
Css In React
🍭 CSS in React - Learn the best CSS in JS frameworks by example
Stars: ✭ 101 (-47.4%)
Mutual labels: styled-components, css-in-js, jss
Styled Tools
Useful interpolated functions for CSS-in-JS
Stars: ✭ 761 (+296.35%)
Mutual labels: styled-components, css-in-js, jss
tsstyled
A small, fast, and simple CSS-in-JS solution for React.
Stars: ✭ 52 (-72.92%)
Mutual labels: styled-components, css-in-js, jss
Postjss
Use the power of PostCSS in compiling with JSS
Stars: ✭ 40 (-79.17%)
Mutual labels: styled-components, css-in-js, jss
Grid
This package has moved and renamed
Stars: ✭ 2,079 (+982.81%)
Mutual labels: styled-components, css-in-js
Onno
Responsive style props for building themed design systems
Stars: ✭ 95 (-50.52%)
Mutual labels: styled-components, css-in-js
Nanostyled
A <1kB library for styling React components as if with CSS-in-JS, without CSS-in-JS
Stars: ✭ 104 (-45.83%)
Mutual labels: styled-components, css-in-js
Xstyled
A utility-first CSS-in-JS framework built for React. 💅👩🎤⚡️
Stars: ✭ 1,835 (+855.73%)
Mutual labels: styled-components, css-in-js
Horror
😱 React HTML elements with CSS-in-JS
Stars: ✭ 78 (-59.37%)
Mutual labels: styled-components, css-in-js
Styled Typography
Typograpy components for react and styled-components
Stars: ✭ 113 (-41.15%)
Mutual labels: styled-components, css-in-js
Scoped Style
A tiny css in js library 🚀
Stars: ✭ 129 (-32.81%)
Mutual labels: styled-components, css-in-js
React Usestyles
🖍 Style components using React hooks. Abstracts the styling library away.
Stars: ✭ 89 (-53.65%)
Mutual labels: css-in-js, jss
Scale
The Scale library offers a set of customizable web components written with Stencil.js & TypeScript. The default theme of the library can be easily replaced so that a corresponding corporate identity of a dedicated brand can be represented.
Stars: ✭ 87 (-54.69%)
Mutual labels: css-in-js, jss
React Image Smooth Loading
[not maintained] Images which just flick to appear aren't cool. Images which appear smoothly with a fade like Instagram are cool
Stars: ✭ 84 (-56.25%)
Mutual labels: styled-components, css-in-js
Styled By
Simple and powerful lib to handle styled props in your components
Stars: ✭ 122 (-36.46%)
Mutual labels: styled-components, css-in-js
Goober
🥜 goober, a less than 1KB 🎉 css-in-js alternative with a familiar API
Stars: ✭ 2,317 (+1106.77%)
Mutual labels: styled-components, css-in-js
Next Dark Mode
🌑 Enable dark mode for Next.js apps
Stars: ✭ 133 (-30.73%)
Mutual labels: styled-components, css-in-js
Styled Bootstrap
💅🏻 A styled-component implementation of Bootstrap
Stars: ✭ 154 (-19.79%)
Mutual labels: styled-components, css-in-js
Filbert Js
A lightweight(~1kb) css-in-js framework
Stars: ✭ 167 (-13.02%)
Mutual labels: styled-components, css-in-js
Autocomplete for React Native and css-in-js for Atom and VS Code
Now get Autocomplete for CSSinJS libraries using object styles.
Installation
apm install css-in-js
Or go to Settings → Install and search for css-in-js
Usage
const btnA = css({ /* styles */ });
const btnB = glamorous.div({ /* styles */ });
const btnC = StyleSheet.create({ /* styles */ });
Only works for these keywords by default you can edit in settings for more.
glamorous | css | StyleSheet.create
Does not work for general objects
let styles = {
/* styles */
}
This is basically a fork of autocomplete-css
CSS in JS for VS Code
Provides CSS in JS autocompletion and converts kebab-case CSS to camelCase CSS and vice versa
- Provides autocompletion options for CSS styles as a style object for use in CSS in JS (like
glamorous
!) - Converts CSS between regular CSS syntax (strings) and CSS-in-JS syntax (style objects)
Autocomplete
Convert CSS in JS
How to Use CSS Conversion
Select some block of text in a javascript
or typescript
file and use cmd+shift+p
to bring up the command palette, then select Convert CSS-in-JS
.
Or use the keyboard shortcut cmd+shift+j
(ctrl+shift+j
on Windows).
Coming Soon
Codemods for easy shifting between css-in-js libraries
Note that the project description data, including the texts, logos, images, and/or trademarks,
for each open source project belongs to its rightful owner.
If you wish to add or remove any projects, please contact us at [email protected].