CSS 프레임워크를 사용하면 예쁘고 멋진 웹 디자인 템플릿을 쉽게 사용할 수 있다. 아래는 주요 프레임워크들이며, 세부적인 디자인들을 찾아서 자신의 웹사이트에 사용하면 좋을 것이다.
대부분의 프레임워크 웹사이트에 Documentation(또는 Docs. :설명서)에 프레임워크의 요소들(Components)에 대한 설명이 나와있다. 요소들의 디자인을 보면서 자신이 필요한 프레임워크를 고를 수 있다. 또는 프레임워크를 사용한 웹사이트 예제가 있다면 한 번 들어가 보는 것도 좋다.
부트스트랩: https://getbootstrap.com/
Bootstrap
The most popular HTML, CSS, and JS library in the world.
getbootstrap.com
파운데이션: https://get.foundation/
The most advanced responsive front-end framework in the world. | Foundation
Foundation Download Foundation 6 Responsive design gets a whole lot faster A Framework for any device, medium, and accessibility. Foundation is a family of responsive front-end frameworks that make it easy to design beautiful responsive websites, apps and
get.foundation
테일윈드: https://tailwindcss.com/
Tailwind CSS - Rapidly build modern websites without ever leaving your HTML.
Documentation for the Tailwind CSS framework.
tailwindcss.com
머티리얼라이즈: https://materializecss.com/
Documentation - Materialize
materializecss.com
머티리얼 디자인 라이트: https://getmdl.io/
Material Design Lite
Material Design Lite Material Design Lite lets you add a Material Design look and feel to your websites. It doesn’t rely on any JavaScript frameworks and aims to optimize for cross-device use, gracefully degrade in older browsers, and offer an experience
getmdl.io
부르마: https://bulma.io/
Bulma: Free, open source, and modern CSS framework based on Flexbox
Bulma is a free, open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.
bulma.io
스켈레톤: http://getskeleton.com/
Skeleton: Responsive CSS Boilerplate
Heading Heading Heading Heading Heading Heading The base type is 15px over 1.6 line height (24px) Bolded Italicized Colored Underlined
getskeleton.com
시맨틱 UI: https://semantic-ui.com/
Semantic UI
Shipping Choose your shipping options
semantic-ui.com
Pure
Pure is a ridiculously tiny CSS library you can use to start any web project.
purecss.io
UI 키트: https://getuikit.com/
UIkit
UIkit, a lightweight and modular front-end framework for developing fast and powerful web interfaces.
getuikit.com
밀리그램: https://milligram.io/
Milligram - A minimalist CSS framework
Milligram - A minimalist CSS framework
milligram.io
수지: https://www.oddbird.net/susy/
Susy
CSS layout framework
www.oddbird.net
프라이머: https://primer.style/
Primer Design System
The design system that powers GitHub
primer.style
스펙터: https://picturepan2.github.io/spectre/
Spectre.css CSS Framework
Spectre.css CSS Framework is a lightweight, responsive and modern CSS framework for faster and extensible development. Spectre provides basic styles for typography and elements, flexbox based responsive layout system, pure CSS components and utilities with
picturepan2.github.io
타키온: https://tachyons.io/
TACHYONS - Css Toolkit
Wide Measure Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no
tachyons.io
'🕸웹 > 🟦CSS' 카테고리의 다른 글
[20210616] CSS 기초3 (0) | 2021.06.16 |
---|---|
[20210615] CSS 기초2 (0) | 2021.06.15 |
[20210615] CSS 기초 (0) | 2021.06.15 |