React Native - Design - Color Reference
in REACT on React Native, React native
RN에서의 component들은 JavaScript를 이용해서 스타일링 된다. 색깔 property들은 CSS가 웹에서 동작하는 방식과 비슷하다.
Color API
RN는 여러 색깔 API를 제공한다.
- PlatformColor는 플랫폼의 색깔 시스템을 참조할 수 있게 한다.
- DynamicColorIOS는 iOS 특정적이고 light와 dark 모드에서 어떤 색깔을 사용할 지 결정할 수 있게 한다.
색깔 표기법
RGB
RN은 16진법과 함수 표기법 모두를 rgb()와 rgba()로 지원한다.
#f0f(#rgb)#ff00ff(#rrggbb)#f0ff(#rgba)#ff00ff00(#rrggbbaa)rgb(255, 0 ,255)rgba(255,0,255, 1.0)
Hue Saturation Lightness (HSL)
RN는 함수 표기법으로 hsl()과 hsla()를 지원한다.
hsl(360, 100%, 100%)hsla(360, 100%, 100%, 1.0)
Color ints
RN은 또한 int 값으로 색을 지원한다.
0xff00ff00
Named colors
RN에서 색의 이름 문자열을 값으로 사용할 수도 있다.
RN은 오직 소문자 이름만 취급한다.
transparent는 rgba(0,0,0,0)의 줄임말이다.
Color keywords
이름이 있는 색은 CSS3/SVG 명시를 따른다.
