부트스트랩 외에 디자인 편하게 할 수 있는 css있나요?

2019. 11. 28. 13:12

부트스트랩은 너무 흔하디 흔해서 다른 걸로 해보고 싶은데

부트스트랩 외에 요즘에 많이 쓰이거나 새로운 스타일시트가 있나요?

공유하고 돈벌기 ♥︎

총 4개의 답변이 있습니다.

질문자 채택 답변
제네시스블록

Figma(https://www.figma.com/)

라는 온라인툴을 사용하시면 원하시는 디자인을

UI를 빠르게 디자인 해보실 수 있습니다.

디자인하신 CSS를 다운로드, 스마트폰으로 내보내기도 가능합니다.

CSS 라이브러리는

TailwindCSS(https://tailwindcss.com)와 Bulma(https://bulma.io)를 추천드립니다.

2019. 11. 29. 05:28
16
연구소

ui컴포넌트 라이브러리를 고민하고 계시군요.

가장 널리알려진게 bootstrap 과 vuetify 두가지입니다.

부트스트랩도 유료버전을 검색하시면 새로운 스타일들이 많이 나오긴합니다.

UI 컴포넌트 라이브러리

UI 컴포넌트 라이브러리?
디자인된 UI 구성요소들(버튼, 콤보박스, 리스트박스 등의 화면 구성요소들)의 모음

  • Bootstrap vs Vuetify

  • Bootstrap

    • 트위터가 개발한 역사와 전통의 UI 컴포넌트 라이브러리

    • 반응형 웹디자인 (모바일 화면과 데스크탑 화면을 적절히 지원)

  • Vuetify

    • 커뮤니티가 개발

    • 구글이 제안한 '머티리얼라이즈 디자인' 제공 (플랫 스타일 디자인)

최근에 bit 도 있고 많이 있습니다.

각각 비슷하지만 장단점이 있어서 검색하시고 선택하시기 바랍니다.

2019. 11. 29. 07:54
14
솔루션개발팀

불라(bulma)

다운로드 사이트: https://bulma.io/expo/
3분도 안되는 Bulma 동영상을 보고나면 편리한 사용법에 깜짝 놀라게 될 것이다.
장점: 가볍고 최소화된 곳/ 부트스트랩이 너무 많은 스타일이 있다면
불라를 사용
빠른 개발을 위해 무료 템플릿을 참조할 수도 있다.

용량: bulma-0.6.1.zip 91K

UIKit 프레임워크

다운로드 사이트: https://getuikit.com/

코코아 터치 프레임워크에 포함된 UIKit

  • UIKit은 iOS 애플리케이션 개발시 사용자에게 보여질 화면을 구성하고 사용자 액션의 대응에 관련된 다양한 요소를 포함

  • UIkit은 iOS 애플리케이션의 사용자 인터페이스를 구현하고 이벤트를 관리하는 프레임워크

UIKit 프레임워크는 제스처 처리, 애니메이션, 그림 그리기, 이미지 처리, 텍스트 처리, 등 사용자 이벤트 처리를 위한 클래스를 포함한다.
또한 테이블뷰, 슬라이더, 버튼, 텍스트 필드, 알림창 등 애플리케이션 화면을 구성하는 요소를 포함한다.
UIKit에서 UIResponder에서 파생된 클래스나, 사용자 인터페이스에 관련된 클래스는 모두 애플리케이션의 메인 쓰레드(혹은 메인 디스패치 큐) 에서만 사용하라.
UIKit 은 iOS와 tvOS 플랫폼에서 사용한다.

새롭게 ViewController를 생성하면 상단에 import UIKit이 기본적으로 명시되어 있다.

semantic ui

다운로드 사이트: https://semantic-ui.com/elements/button.html

  • semantic UI는 UI Library의 카테고리에 속하는 제품입니다. 이 도구는 잘 만들어진 기본 부품(component)를 제공합니다. 이 부품들을 활용해서 빠르게 서비스를 구현할 수 있고, 필요에 따라서는 개조해서 사용할수도 있습니다.

element ui

다운로드 사이트: https://element.eleme.io/

  • 심플한 UI 참조

pure css

다운로드 사이트: https://purecss.io/layouts/

  • 레이아웃만 참조

material design Lite

다운로드 사이트: https://getmdl.io/

  • 레이아웃만 참조

기타 프레임워크 순위 및 의견들 정리된 곳

https://www.slant.co/

2019. 11. 29. 11:01
14

부트스트랩 기반으로 색상표 등 스타일시트를 바꿔서 제공하는것들이 많이 있습니다.

https://bootswatch.com/

해당 사이트 등 많은 곳에서 이러한 자료들을 공유하고 있으니 참고 하여 사용하시면 될것 같습니다.

또한 커스텀하여 공통적인 본인만의 스타일시트를 구성해두시는것도 좋다고 생각됩니다.

2019. 11. 29. 01:40
13