Lysmodus UI-design Hovedkort

{ "type": "Demonstrasjonsprosjekt for UI-designsystem", "theme": "{argument name=\"visual theme\" default=\"Optisk vitenskap og lysbrytning\"}", "overall_aesthetic": "En ren hvit bakgrunn, lys fargemodus, futuristisk og sofistikert følelse; dens særegne trekk ligger i {argument name=\"primary gradient colors\" default=\"Iriserende, myk oransje, gul, cyan, lilla, rosa\"} utsmykning", "header": { "title": "{argument name=\"system name\" default=\"LIGHTCORE PRISM\"}", "subtitle": "UI-designsystem - Lysmodus", "tags": [ "Futuristisk", "følelse av sofistikering", "Fokus" ], "hero_graphic": "3D gjennomsiktig glassring som bryter iriserende lys" }, "layout": { "sections": [ { "title": "color", "count": 5, "labels": [ "Hvit #FFFFFF", "Snøhvit #FAFAFC", "Skiferfarge #F2F4F8", "Kantfarge" #E6E8EF", "Svart #0A0A0C" ], "beskrivelse": "5 avrundede firkantede heldekkende fargeblokker" }, { "title": "Prismegradient", "count": 1, "beskrivelse": "En lang horisontal gradientlinje med fem heksadesimale fargekoder nedenfor." }, { "title": "typesetting", "beskrivelse": "Den store 'Aa'-skriften er oppført i fire vekter (lys, vanlig, medium, halvfet) sammen med hele alfabetet/tallene." }, { "title": "icon", "count": 12, "beskrivelse": "12 minimalistiske linjestilikoner arrangert i et 2x6-rutenett." }, { "title": "Knapp", "count": 8, "categories": [ "main", "secondary", "text", "icon" ], "description": "Det er totalt 8 knapper som viser normal og deaktivert status for hver kategori. Hovedknappen har en iriserende kant og {argument name=\"primary button text\" default=\"Start using\"} tekst." }, { "title": "navigation", "count": 2, "variants": [ "Desktop", "mobile" ], "description": "Desktop-navigasjonen inkluderer en logo, fire tekstlenker, et søkefelt, en påloggingsknapp og et navigasjonsfelt for mobil." }, { "title": "Komponenter", "count": 6, "items": [ "Kort: 'Fotonmotor' med abstrakt regnbuegrafikk og knapper", "Inndatabokser: en merket søkefelt og en e-postinndataboks.", "Fremdriftslinje: 68 % regnbuefremdriftslinje", "Faner: Oversikt, Analyse, Innstillinger", "Brytere: 2 brytere (av/på)", "Datavisualisering: et sektordiagram med 3 forklaringselementer og et 7-dagers linjediagram." ] }, { "title": "Nettside", "beskrivelse": "Skrivebordsnettlesermodell, inkludert tittel '{argument name=\"hero headline\" default=\"Bygger fremtiden med lys og farge\"} Designet inkluderer to knapper, en flytende 3D-regnbuebølgegrafikk og fem partnerlogoer nederst." }, { "title": "Mobilapplikasjon", "description": "Smarttelefonmodellen viser en saldo på 24 880 dollar, et linjediagram, fire hurtighandlingsikoner, en liste over nylige aktiviteter med tre elementer og en navigasjonslinje nederst med fire ikoner." } ] } }