{"repo":"ae9is/react-fontpicker","free":true,"listed":false,"github":"https://github.com/ae9is/react-fontpicker","clone":"git clone https://github.com/ae9is/react-fontpicker.git","description":"A Google font picker for React","language":"CSS","stars":57,"topics":["cypress","font","fontpicker","google-fonts","picker","react","typescript","vite","vitest","component-library"],"license":"MIT","category":"ui-components","readme_excerpt":"react-fontpicker &nbsp; A Google font picker component for React. - No dependencies (other than React) - No Google API key required - 1600+ Google fonts, customisable - Fast, high quality font previews from pre-generated SVG images - Optionally autoloads fonts Forked from https://github.com/Mikk3lRo/vue-fontpicker/ Documentation A live demo including usage is available at: https://ae9is.github.io/react-fontpicker/ Installing Then, import the component and stylesheet: Styling See css classnames in: packages/fontpicker/src/components/FontPicker.css An example restyling the font picker An example integrating the font picker into an actual app: ae9is/uimix Project structure The font picker project lives in this Turborepo monorepo at packages/fontpicker/ The live demo is a Vite app you can run yourself via npm run dev and which builds to /docs . Uses tsconfig.json . The font picker component itself builds via tsup (i.e. esbuild ) to /dist with type definitions generated via tsc according to tsconfig.types.json . The font preview generation script downloads font files to /font-cache and builds font image previews to /font-preview . Performance The font picker previews work by loading font preview image files in CSS. The fonts are split across many image files for faster initial preview. Once the dropdown select is opened, all the preview image files are retrieved enabling smooth scrolling and searching. No requests are made to the Google fonts API unless the font picker is set to a","default_branch":null,"files":null,"tree":[],"storefront":"/r/ae9is","claimed":false,"request_supported":{"post":"https://gitbuyer.com/r/ae9is/react-fontpicker/request-supported","requests":0},"note":"indexed from public GitHub; nothing is for sale on this page. Clone it from GitHub. Paid listings live at /search."}