{"id":15041706,"url":"https://github.com/technoprodev/technoart","last_synced_at":"2026-01-07T06:05:33.296Z","repository":{"id":57066167,"uuid":"137232873","full_name":"technoprodev/technoart","owner":"technoprodev","description":"No more custom CSS - All in one CSS framework for developing clean, professional \u0026 responsive web app.","archived":false,"fork":false,"pushed_at":"2019-02-23T09:03:14.000Z","size":37652,"stargazers_count":3,"open_issues_count":0,"forks_count":0,"subscribers_count":2,"default_branch":"master","last_synced_at":"2025-02-01T14:45:10.828Z","etag":null,"topics":["all-in-one","app","clean","css","framework","js","no-dependencies","professional","reliable","responsive","sass","simple","web"],"latest_commit_sha":null,"homepage":"https://technoartcss.com/","language":"CSS","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/technoprodev.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":".github/CONTRIBUTING.md","funding":null,"license":"LICENSE","code_of_conduct":".github/CODE_OF_CONDUCT.md","threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2018-06-13T15:12:16.000Z","updated_at":"2024-05-27T16:46:22.000Z","dependencies_parsed_at":"2022-08-24T10:10:46.556Z","dependency_job_id":null,"html_url":"https://github.com/technoprodev/technoart","commit_stats":null,"previous_names":[],"tags_count":1,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/technoprodev%2Ftechnoart","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/technoprodev%2Ftechnoart/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/technoprodev%2Ftechnoart/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/technoprodev%2Ftechnoart/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/technoprodev","download_url":"https://codeload.github.com/technoprodev/technoart/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":245822303,"owners_count":20678165,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["all-in-one","app","clean","css","framework","js","no-dependencies","professional","reliable","responsive","sass","simple","web"],"created_at":"2024-09-24T20:46:23.652Z","updated_at":"2026-01-07T06:05:33.281Z","avatar_url":"https://github.com/technoprodev.png","language":"CSS","funding_links":[],"categories":[],"sub_categories":[],"readme":"\u003cdiv style=\"text-align: center;\"\u003e\n  \u003cimg src=\"https://technoartcss.com/assets/img/technoart.png\" alt=\"Technoart logo\" width=\"90\"\u003e\n\u003c/div\u003e\n\n# Technoart\n\n**No more custom CSS** - All in one CSS framework for developing clean, professional \u0026 responsive web app.\n\n**Official Website**: [technoartcss.com](https://technoartcss.com)\n\n**Current Version**: 0.9.9\n\n**TOC**: [What is Technoart](#what-is-technoart) • [Installation](#installation) • [Minimum Setup](#minimum-setup) • [Assets Structure](#assets-structure) • [Definitive Guide](#definitive-guide) • [Starter Template](#starter-template) • [Contributing](#contributing) • [Community](#community) • [License](#license) • [Done List and Possible Contribution List](#done-list-and-possible-contribution-list)\n\n## What is Technoart\n\nTechnoart is **all in one** CSS framework for developing **clean**, **professional** \u0026 **responsive** web app. Technoart helps you slice any web mockup without any custom CSS. Ofcourse, there will be some cases that still need custom CSS.\n\nOur goals are not only making Technoart **simple**, **reliable**, and has **no dependencies**. We also eager to help you using Technoart easily with [Definitive Guide](https://technoartcss.com/guide). What is the point of great tool without no one being able to use it.\n\nAnd with [Starter Template](https://technoartcss.com/starter-template), we hope you are inspired and can use Technoart for real web development.\n\n## Installation\n\nThere are several methods to install Technoart:\n- Include it via jsDelivr CDN [Technoart CSS](https://cdn.jsdelivr.net/npm/technoart@0.0.9/dist/css/technoart.min.css) \u0026 [Technoart JS](https://cdn.jsdelivr.net/npm/technoart@0.0.9/dist/js/technoart.min.js)\n- Download it via this [link](https://github.com/technoprodev/technoart/releases/download/v0.0.9/bootstrap-0.9.9-dist.zip)\n- Clone the [repo](https://www.github.com/technoprodev/technoart/): `git clone https://github.com/technoprodev/technoart.git`\n- Via package manager [npm](https://www.npmjs.com/): `npm install technoart`\n- Via package manager [yarn](https://yarnpkg.com): `yarn add technoart`\n- Via package manager [composer](https://getcomposer.org/): `composer require technoprodev/technoart`\n\n## Minimum Setup\n\nAlthough there are several methods to install Technoart, the easiest way to try Technoart is to create an index.html file and include Technoart via CDN:\n\n```\n\u003c!doctype html\u003e\n\u003chtml lang=\"en\"\u003e\n  \u003chead\u003e\n    \u003cmeta charset=\"utf-8\"\u003e\n    \u003cmeta name=\"viewport\" content=\"width=device-width, initial-scale=1, minimum-scale=1, shrink-to-fit=no\"\u003e\n\n    \u003c!-- technoart css --\u003e\n    \u003clink rel=\"stylesheet\" href=\"https://cdn.jsdelivr.net/npm/technoart@0.0.9/dist/css/technoart.min.css\"\u003e\n\n    \u003ctitle\u003eTitle\u003c/title\u003e\n  \u003c/head\u003e\n  \u003cbody\u003e\n    \u003ch1\u003eYour smile makes me happy.\u003c/h1\u003e\n\n    \u003c!-- technoart js --\u003e\n    \u003cscript src=\"https://cdn.jsdelivr.net/npm/technoart@0.0.9/dist/js/technoart.min.js\"\u003e\u003c/script\u003e\n  \u003c/body\u003e\n\u003c/html\u003e\n```\n\nNote: We **do not** recommend that beginners start with package manager like npm, especially if you are not yet familiar with Node.js-based build tools.\n\n## Assets Structure\n\nWithin the download you will find the following directories and files:\n\n```\ntechnoart/\n├── css/\n│   ├── technoart.css\n│   ├── technoart.css.map\n│   ├── technoart.min.css\n│   └── technoart.min.css.map\n└── js/\n    ├── technoart.js\n    ├── technoart.js.map\n    ├── technoart.min.js\n    └── technoart.min.js.map\n```\n\n## Definitive Guide\n\nLearning Technoart is **easy**. Visit [Definitive Guide](https://technoartcss.com/guide) for comprehensive guidance of using Technoart.\n\n## Starter Template\n\nStart a new project with 50\u003csup\u003e+\u003c/sup\u003e choices of clean and professional [Starter Template](https://technoartcss.com/starter-template).\n\n## Community\n\nGet updates on Technoart's development and interact with community members.\n\n- Watch our repo hosted on [Github](https://github.com/technoprodev/technoart).\n- Follow us on [Twitter](https://twitter.com/technoartcss) for Technoart updates.\n- Follow us on [Instagram](https://instagram.com/technoartcss) for beautiful gallery.\n- Get help on [Stack Overflow](https://stackoverflow.com/questions/tagged/technoart) with `technoart` tag.\n- When you modify/add Technoart functionality and want it to be distributed through [npm](https://www.npmjs.com/browse/keyword/technoart) or similar delivery mechanism, use keyword `technoart` on packages name for maximum discoverability.\n\n## License\n\nCopyright (c) 2018-present [Fandy Pradana](https://prafandy.com). Licensed under [MIT](https://github.com/technoprodev/technoart/blob/master/LICENSE).\n\n## Done List and Possible Contribution List\n\nThe following is a complete list of Technoart components, how the javascript component specifications are built, how Technoart assets are distributed, how users can interact with Technoart, the technology used to build the website [https://technoartcss.com](https://technoartcss.com), all pages that are exist on [https://technoartcss.com](https://technoartcss.com), the plugin used in the [Definitive Guide](https://technoartcss.com/guide) page, [Definitive Guide](https://technoartcss.com/guide) available translations and a list of pages that are exist on [Starter Tempalate](https://technoartcss.com/starter-template)\n\nThis full list is not commonly published on other opensource projects. But there is a lot of hope why this list is published. Among them:\n- By knowing what has been done, Technoart contributors can have awesome feeling about their achievements developing Technoart\n- By knowing Technoart development roadmap, Technoart users can faithfully waiting for any updates that will be useful for them\n- Opening opportunities for community to contribute to:\n    - developing CSS \u0026 javascript components\n    - write a unit test\n    - setup Continuous Integration that is currently not done yet\n    - bug reporting\n    - features requesting\n    - asking \u0026 answering questions\n    - writing content of twitter page, instagram page \u0026 medium\n    - setup an analytic that is currently not done yet\n    - developing website pages that are currently only Home, Guide \u0026 Starter Templates that exist\n    - helping [Definitive Guide](https://technoartcss.com/guide) page to be easier for users to learn\n    - translating [Definitive Guide](https://technoartcss.com/guide) page to languages ​​other than English to help developers who want to learn Technoart but don't have good English skill\n    - give an idea or mockup UI that can be displayed on [Starter Tempalate](https://technoartcss.com/starter-template) page\n    - developing [Starter Tempalate](https://technoartcss.com/starter-template) page\n    - finding typos\n\nFor now, the list below has 4 additional information, which are:\n- done: it has been completed but it is possible to develop it further\n- continue: always continue\n- soon: not finished yet and contributions from the community would be extremely helpful\n- later: not developed in the near future\n\nAnd finally, here are the contents of the list:\n- Components\n    - box (done)\n    - space (done)\n    - text-color (done)\n    - background-color (done)\n    - percentage-background-color (done)\n    - background-image (done)\n    - border-color (done)\n    - typography (done)\n    - button (done)\n    - form (done)\n    - table (done)\n    - image (done)\n    - embed (done)\n    - menu (done)\n    - layout (done)\n    - pagination (done)\n    - breadcrumb (done)\n    - circle-icon (done)\n    - positioned-child (done)\n    - stack-content (done)\n    - hover-zoom (done)\n    - fixed-on-scroll (done)\n    - back-to-top (done)\n    - toggle (done)\n    - clearfix-and-float (done)\n    - visibility (done)\n    - shadow (done)\n    - rounded (done)\n    - underline (done)\n    - stretch (done)\n- Javascript component specifications\n    - No depedency (done)\n    - Triggering event (soon)\n    - Custom setting (soon)\n    - Unit test (soon)\n    - Continuous Integration (soon)\n- Distribution\n    - Via cdn (done)\n    - Via npm (done)\n    - Via yarn (done)\n    - Via composer (done)\n    - dist folder for general usage (done)\n    - dist-components folder for custom usage (done)\n    - Using source maps (done)\n- Community\n    - [Bug reports, features requests \u0026 submitting pull requests](https://github.com/technoprodev/technoart/issues) (continue)\n    - Asking and answering question via [stackoverflow](https://stackoverflow.com/questions/tagged/technoart) (continue)\n    - [Twitter page](https://instagram.com/technoartcss) (continue)\n    - [Instagram page](https://twitter.com/technoartcss) (continue)\n    - Medium (soon)\n- Website technoartcss.com\n    - Using jekyll \u0026 github pages (done)\n    - Https (done)\n    - Analytic (soon)\n- Website Pages\n    - Home (done)\n    - Guide (done)\n    - Starter Template (done)\n    - Gallery (soon)\n    - Support (soon)\n    - License (soon)\n    - Contribute (soon)\n    - Brand (soon)\n    - Team (soon)\n    - Curated List (later)\n    - Live Chat (later)\n- Guide Specification\n    - Example preview (done)\n    - Example code \u0026 copy to clipboard (done)\n    - Header with anchor (done)\n    - Scrollspy (done)\n- Guide Translation\n    - English (done)\n    - Indonesia (soon)\n- Starter Template\n    - General\n        - Homepage (done)\n        - Service (done)\n        - Portfolio (done)\n        - Pricing (done)\n        - FAQ (done)\n        - Our Team (done)\n        - Our Client (soon)\n        - About Us (done)\n        - Contact Us (soon)\n        - My Profile (soon)\n            - View Profile (soon)\n            - Edit Profile (soon)\n            - Change Password (soon)\n        - Authentication (soon)\n        - Error 404 (soon)\n        - Coming Soon (soon)\n        - Legal (soon)\n            - Privacy Policy (soon)\n            - Term of Service (soon)\n        - Search Result (soon)\n    - Minimum Layout (soon)\n    - Admin (soon)\n    - Blog (soon)\n    - Magazine (soon)\n    - News (soon)\n    - One Page (soon)\n    - Email (soon)\n    - Curriculum Vitae (soon)\n    - Ecommerce (soon)\n    - Job (soon)\n    - University (soon)\n    - Wedding (soon)\n    - Real Estate (soon)\n    - Social Media (soon)\n        - News Feed (soon)\n        - My Profile (soon)\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Ftechnoprodev%2Ftechnoart","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Ftechnoprodev%2Ftechnoart","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Ftechnoprodev%2Ftechnoart/lists"}